• js 动态添加行,删除行,并获得select中值赋予 input


    <html>
     <head>
      <title>Ace Test</title>
      <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.0/jquery.min.js"></script>

    <script language="JavaScript">   
      var cGetRow=-99999;
      function insertrow(){
      var newrow = document.all.newTB.rows[0].cloneNode(true); //克隆一行
      document.all("newTB").appendChild(newrow); //添加刚才克隆的一行
       var objs = document.getElementsByName("project1");
     
     objs[objs.length-1].value=""; 
     
     
      }
       

      function GetRow(){
     //获得行索引
     //两个parentElement分别是TD和TR,rowIndex是TR的属性
     //this.parentElement.parentElement.rowIndex
        cGetRow=window.event.srcElement.parentElement.parentElement.rowIndex;
       
        DelRow(cGetRow);//点击checkbox时,直接删除行。
      }
      function DelRow(iIndex){
     //删除一行
     if(iIndex==-99999){
       alert("系统提示:没有选中行号!");
     }else{
       newTB.deleteRow(iIndex);
       iIndex==-99999;//将rowIndex恢复默认值。
     }
      }
     
      function GetPidValue(st){
      // var chooseVal = st.innerText;
     //alert("选择的值是:" + chooseVal); 
     //$("#result").val("Hello world!");
     
        cGetRow=window.event.srcElement.parentElement.parentElement.rowIndex;
     
     
     var tableInfo = "";  
     var tableObj = document.getElementById("newTB"); 
     //alert( tableObj.rows[cGetRow].cells.length)
     
     var Cell=tableObj.rows[cGetRow].cells[1].innerHTML
     
     var b=document.getElementsByName('project')[cGetRow];//这里也可以用getElementById
     var selectValue;
     for(var i=0;i<b.length;i++){
      if(b[i].selected==true){
       selectValue=b[i].innerText;
      }
     }
     
      
     var objs = document.getElementsByName("project1");
     objs[cGetRow].value=selectValue; 
     
     
     
       
      }
     
      </script>
     </head>

     <body class="dialog_body">
      <form method="POST" onSubmit="return   doSubmit(this)">
     
       
         <table border="1" width="900" cellpadding="0" cellspacing="0" class="table">
        
          <!-- 隐藏table,用于克隆的行 begin -->
          <tbody id="ACE_HIDDEN_TABLE" >
          
          </tbody>
         </table>
         <!-- 隐藏table,用于克隆的行 end -->
        
         <table border="1" width="900" cellpadding="0" cellspacing="0" class="table">
          <!-- 插入新行的区域 begin -->
          <tbody id="newTB">
        <tr>
           
            <td width="16%">
             <select id="pid" name="project"" onchange="GetPidValue(this)">
              <option value=""></option>
              <option value="0">
               人员编号
              </option>
              <option value="1">
               姓名
              </option>
             </select>
            </td>
            <td width="16%">
             <input id="result" name="project1" type="text" value="" >
            </td>
      <td><input type="button"  value="删除" onClick="GetRow()"/></td>
           </tr>
          </tbody>
          <!-- 插入新行的区域 end -->
         </table>

       <div align="right" style="margin:10px;"> 
        <input type="button" onClick="insertrow();" value="增加一行">
        <input type="button" onClick="DelRow(cGetRow);" value="删除一行">
       </div>
      
      </form>
     </body>
    </html>

  • 相关阅读:
    git命令总结
    Junit
    zookeeper--概述
    NIO与Socket
    分区分表
    ThreadLocal
    垃圾收集器
    垃圾收集算法
    主从复制
    Redis--集群
  • 原文地址:https://www.cnblogs.com/lgzh3/p/3146032.html
Copyright © 2020-2023  润新知