1. 程式人生 > >js註冊實現

js註冊實現

-- 時間 顯示 func length stun ble document char

 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 作者:[email protected] 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>

js註冊實現