zoukankan      html  css  js  c++  java
  • 留言板

    留言板:一个提交的信息显示框、一个文本输入框,一个提交按钮,当点击提交按钮,文本区域的信息提交到提交区域。

    <!doctype html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>留言板</title>
        <style type="text/css">
        *{
            margin: 0 auto;
        }
    #div1{
        500px;
        height:300px;
        overflow: auto;
        border:1px solid blue;
        margin: 0 auto;
    }
    #div1 p{
        font-size: 25px;
        font-family: 微软雅黑;
        color: red;
    }
    #text{
        500px;
        height:100px;
        margin:0 auto;
    }
        </style>
    <script type="text/javascript">
        window.onload=function(){
            var oBtn=document.getElementById('btn');
            var oText=document.getElementById('text');
            var oDiv=document.getElementById('div1');
            oBtn.onclick=function(){
                if(oText.value==''){
                    return false;
                }
                var newP=document.createElement('p');//创建p标签
                newP.innerHTML=oText.value;
                oDiv.appendChild(newP);
                oText.value='';
    
    
            }
        }
    </script>
    </head>
    <body>
        <div id="div1">
            <p>这里边是提交的内容</p>
        </div>
        <textarea id="text" ></textarea>
        <br />
        <input type="button" value="提交留言" id="btn">
    
    </body>
    </html>
    
  • 相关阅读:
    html5-css渐变色
    html5-css综合练习
    html5-css背景
    html5-css边框全
    html5-css边框img
    进程控制(二)与linux下的自有服务
    进程检测与控制(一)
    权限及软件包管理
    linux下文件权限管理
    vim及用户组管理
  • 原文地址:https://www.cnblogs.com/lzzhuany/p/4564399.html
Copyright © 2011-2022 走看看