`

js clone

JavaScriptXHTMLJ#HTML 
阅读更多
  1. <!DOCTYPE html PUBLIC  "-//W3C//DTD XHTML 1.0 Transitional//EN"   "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd" >  
  2. <html xmlns="http://www.w3.org/1999/xhtml" >  
  3. <head>  
  4. <meta http-equiv="Content-Type"  content= "text/html; charset=gb2312"  />  
  5. <title> 控件cloneNode （）方法的使用</title>  
  6. <script language="javascript" >  
  7.  i=1 ;  
  8.  function AddRow()  
  9.  {  
  10.    var tableObject=new  Object();  
  11.      
  12.    var isneed=true ;  
  13.      
  14.    tableObject=document.getElementById("CloneNodeShow" );  
  15.    //判断是否有必要添加新的输入行   
  16.    for (var j= 0 ;j<tableObject.all.tags( "input" ).length;j++)  
  17.    {  
  18.     var inputs = tableObject.all.tags("input" )[j];   
  19.     if (inputs.type== "text"  && inputs.value== "" )  
  20.     {  
  21.      isneed=false ;  
  22.     }  
  23.    }  
  24.    if (isneed)  
  25.    {  
  26.     //添加一行      
  27.     var newTR=tableObject.insertRow();  
  28.     var td0=newTR.insertCell();  
  29.     var td1=newTR.insertCell();  
  30.     var td2=newTR.insertCell();  
  31.     var td3=newTR.insertCell();  
  32.       
  33.     td0.innerHTML=(++i)+'.' ;  
  34.     td1.innerHTML='<input type="text" name="username"/>' ;  
  35.     //true表示深度克隆   
  36.     var newSelect=document.getElementById("sexType" ).cloneNode ( true );  
  37.     newSelect.id="sexType" +i;  
  38.     td2.appendChild(newSelect);  
  39.     td3.innerHTML='<input type="text" name="age" onchange="AddRow()"/>' ;     
  40.    }  
  41.  }  
  42. </script>  
  43. </head>  
  44. <body>  
  45. <form>  
  46.  <table id="CloneNodeShow"  border= "2"  bordercolor= "#000000" >  
  47.   <tr><th></th><th> 姓名</th><th>性别</th><th>年龄</th></tr>  
  48.   <tr id="signTR"   >  
  49.    <td>1 .</td>  
  50.    <td><input type="text"  name= "username" /></td>  
  51.    <td>  
  52.     <select name="sexType"  id= "sexType" >  
  53.      <option value="%" >请选择性别</option>  
  54.      <option value="0" >男</option>  
  55.      <option value="1" >女</option>  
  56.     </select>  
  57.    </td>  
  58.    <td><input type="text"  name= "age"  onchange= "AddRow()" /></td>  
  59.   </tr>  
  60.  </table>  
  61. </form>  
  62. </body>  
  63. </html> 
分享到：
| c++算法
评论
发表评论

您还没有登录,请您登录后再发表评论

相关推荐

Magicbox
Global site tag (gtag.js) - Google Analytics