<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>

js 动态添加行，删除行，并获得select中值赋予 input的更多相关文章

  1. js动态参数作为Object的属性取值

    js动态参数作为Object的属性取值var myObj = {"a":1,"b":2};var a = 'a';myObj[a] 就可以获取到 属性a的值了

  2. js动态添加删除行，兼容ie和火狐

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  3. js动态添加行

    <script> $(function() { //增加上传 var addli = function() { var linum = parseInt($(".pic-wrap ...

  4. js获得checkbox选中值及input后面的文本

    原文:http://blog.csdn.net/u014079773/article/details/51865596 js如何获得多个checkbox选中的值及input后面所跟的文本 <!d ...

  5. js动态的往表格中加入表单元素

    效果如图: 这里我用的是layui的静态表格,其他框架也是一样的(只要你都表单元素要通过js进行渲染),我的需求是在表单中放了表格的元素,表格中还有表单的元素.表格中的行数据是js动态添加的,正常的添 ...

  6. Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法

    Easyui中使用jquery或js动态添加元素时出现的样式失效的解决方法 2014-03-27 11:44:46|  分类: Easy UI|举报|字号 订阅     可以使用$.parser.pa ...

  7. JS动态改变select选择变更option的index值

    document.getElementById("louyuming").options[0].selected=true; function jsSelectIsExitItem ...

  8. UEditor js动态创建和textarea中渲染【原】

    UEditor动态创建和textarea中渲染 http://ueditor.baidu.com/website/examples/textareaDemo.html <!DOCTYPE> ...

  9. js 获取select的值 / js动态给select赋值

    jQuery获取Select选择的Text和Value:语法解释:1. $("#select_id").change(function(){//code...});   //为Se ...

随机推荐

  1. 使用log4net 日志输出到数据库MySQL

    使用Log4Net的输出日志到MySQL 使用步骤如下: 1. 添加引用Log4Net.dll, mysql.data.dll到工程中 note: mysql.data.dll 版本要高,最好到mys ...

  2. [MySQL] 号称永久解决了复制延迟问题的并行复制，MySQL5.7

    一.缘由: 某天看到主从复制延时的告警有点频繁,就想着是不是彻底可以解决一下. 一般主从复制,有三个线程参与,都是单线程:Binlog Dump(主) ----->IO Thread (从) - ...

  3. php 对url 操作类:url拼接、get获取页面、post获取页面(带传参)

    /* * @brief url封装类,将常用的url请求操作封装在一起 * */ class URL{ private $error; public function __construct(){ $ ...

  4. type="file" 选择图片后预览

    function setImagePreview(avalue) { var docObj = document.getElementById("doc"); var imgObj ...

  5. FreeBSD从零开始---安装后配置（一）

    一.安装后配置   上次我们说到FreeBSD的安装,这次我们说FreeBSD安装后的配置和简单优化方法.   安装完BSD只是服务器提供服务这条万里长征路的开始,还需要一些基本的设定和优化.不过实际 ...

  6. git 远程仓库 轻松创建

    很多时候,为了方面管理我们写的代码,我们采用git 远程仓库来进行管理和备份.防止代码被他人篡改或删除.那如何来进行创建远程仓库呢? 1.我们必须有一个远程服务器端,在这里可以把任意一台电脑作为服务器 ...

  7. ubuntu12.04安装WineQQ2012

    1:下载WineQQ2012-20120531-Longene.deb 2:直接用软件中心安装或者执行命令,进入文件目录执行sudo dpkg -i WineQQ2012-20120531-Longe ...

  8. C++设计模式-TemplateMethod模板方法模式

    Template模板方法模式作用:定义一个操作中的算法的骨架.而将一些步骤延迟到子类中,模板方法使得子类可以不改变一个算法的结构即可重定义该算法的某些特定步骤. 其关键是将通用算法(逻辑)封装在抽象基 ...

  9. Spring集成Memcached三种方式(一)

    转载:http://blog.csdn.net/u013725455/article/details/52102170 Memcached Client目前有3种: Memcached Client ...

  10. zookeeper 节点的移动与删除

    package com.zhengmo.test; import java.util.List; import org.apache.zookeeper.CreateMode; import org. ...