• js注册实现


     1 <!DOCTYPE html>
     2 <html>
     3     <head>
     4         <meta charset="UTF-8">
     5         <title></title>
     6         <style type="text/css">
     7             
     8             
     9         </style>
    10     </head>
    11     <body>
    12         <div align="center" >
    13             姓名:<input type="text" name="stuName" id="stuName" value="姓名" onfocus="ffocus()"/>
    14             年龄:<input type="text" name="age" id="age" value="年龄" onfocus="ffocus1()"/>
    15             <br /><br />
    16             <input type="button" value="注册" onclick="register()"/>
    17             <!--
    18                 作者:1767757232@qq.com
    19                 时间:2017-10-22
    20                 描述:
    21                 
    22                 <input type="button" value="显示" onclick="show()" />
    23             -->
    24             <input type="button" value="清空" onclick="cclear()"/>
    25             <div id="tip"></div>
    26             <hr color="aqua"/>
    27             <br />
    28             <table id="tab" frame="border" width="30%" borderclorlight="aqua" border="1">
    29                 <tr><th>姓名</th><th>年龄</th></tr>                
    30                 
    31             </table>
    32                 <div id="show"></div>
    33                     <div id="show1"></div>
    34                         <div id="show2"></div>
    35             
    36         </div>
    37     </body>
    38     <script type="text/javascript">
    39         var stuArr=new Array(3);
    40         var i=0;
    41         function register(){
    42             var stuName=document.getElementById("stuName").value;
    43             var age=document.getElementById("age").value;
    44             
    45             var student={stuName:stuName,age:age};
    46             stuArr[i]=student;
    47             document.getElementById("tab").innerHTML=document.getElementById("tab").innerHTML+"<tr><td>"+stuArr[i].stuName+"</td><td>"+stuArr[i].age+"</td></tr>";
    48             i++;
    49             document.getElementById("tip").innerHTML="注册成功";
    50             
    51         }
    52         
    53         function ffocus(){
    54             document.getElementById("stuName").value="";
    55             document.getElementById("tip").innerHTML="";
    56         }
    57         function ffocus1(){
    58             document.getElementById("age").value="";
    59             document.getElementById("tip").innerHTML="";
    60         }
    61         function cclear(){
    62         //    stuArr.splice(0,0);
    63             stuArr.splice(0,stuArr.length);
    64             
    65             document.getElementById("tab").innerHTML="<tr><th>姓名</th><th>年龄</th></tr>        ";
    66             
    67             
    68             document.getElementById("tip").innerHTML="清空成功";
    69             
    70         }
    71     </script>
    72 </html>
  • 相关阅读:
    数据预处理之中心化(零均值化)与标准化(归一化)
    机器学习入门篇——感知器
    JAVA实现QQ聊天气泡
    设计模式学习笔记—策略模式
    JComboBox实现时间控件
    JTree实现QQ好友列表
    JAVA实现带图片的列表——JList
    JAVA与数据库MySQL相连接
    SQL语句
    HTML学习笔记——标签(二)
  • 原文地址:https://www.cnblogs.com/lyxcode/p/7709924.html
Copyright © 2020-2023  润新知