JS增加行复制行删除行的实现代码


Posted in Javascript onNovember 09, 2013
var customerInfoMethod ={  
//复制增加行  
copyrow:function(obj,id)  
{  
var rowIndex=obj.parentNode.parentNode.rowIndex;  
var resrow=document.getElementById(id);  
rowIndex--;  
var newRow=resrow.cloneNode(true);//document.createElement("tr");  
var parent = resrow.parentNode;  
   if(parent.lastChild == resrow){  
   //如果targetElement是parent最后一个子元素,插入newElement  
   parent.appendChild(newRow);  
  }else{  
  //如果不是,插入到targetElement下一个兄弟节点的前面  
   parent.insertBefore(newRow, resrow.nextSibling);  
  }  //newRow.innerHTML=resrow.innerHTML;  
var selectObj = newRow.getElementsByTagName("select");  
for(var a=0;a<selectObj.length;a++){  
selectObj[a].options[0].selected=true;  
}  
var inputObj = newRow.getElementsByTagName("input");  
inputObj[0].style.display="";  
inputObj[1].style.display="none";  
},  
//复制增加行  
copyrowUpdate:function(obj,id)  
{  
var rowIndex=obj.parentNode.parentNode.rowIndex;   
var resrow=document.getElementById(id);  
rowIndex--;  
var newRow=resrow.cloneNode(true);//document.createElement("tr");  
var parent = resrow.parentNode;  
   if(parent.lastChild == resrow){  
   //如果targetElement是parent最后一个子元素,插入newElement  
   parent.appendChild(newRow);  
  }else{  
  //如果不是,插入到targetElement下一个兄弟节点的前面  
   parent.insertBefore(newRow, resrow.nextSibling);  
  }  
//newRow.innerHTML=resrow.innerHTML;  
var selectObj = newRow.getElementsByTagName("select");  
for(var a=0;a<selectObj.length;a++){  
selectObj[a].options[0].selected=true;  
}  
var inputObj = newRow.getElementsByTagName("input");  
for(var i=0;i<inputObj.length-2;i++){  
inputObj[i].value="0";  
}  
inputObj[inputObj.length-2].style.display="";  
inputObj[inputObj.length-1].style.display="none";  
},  
//删除行  
deleteRow:function(rootId,obj) {  
var rootTable = $(rootId);  
rootTable.deleteRow(obj.parentNode.parentNode.rowIndex);  
  }  
}  

/**  
 增加行 fanjf  
*/  
function addRow(tableId,trId){  
var tableObj = document.getElementById(tableId);  
var trObj = document.getElementById(trId);  
//var trIndex = trObj.rowIndex+1;  
var rows = tableObj.rows.length;  
var cell = "";  
var tr = tableObj.insertRow(rows);  
for(i=0;i<trObj.cells.length;i++){  
 cell= tableObj.rows(rows).insertCell(i);  
 cell.innerText= trObj.cells(i).innerText;  
 cell.className= trObj.cells(i).className;  
 cell.innerHTML= trObj.cells(i).innerHTML;  
}  
}  
/**  
 删除行 fanjf  
*/  
function deleteRow(tableId,trId){  
    var tableObj = document.getElementById(tableId);  
    var trObj = document.getElementById(trId);  
    //var trIndex = trObj.rowIndex;//复制tr的行号  
    var rows = tableObj.rows.length;  
    if(rows>0){  
    tableObj.deleteRow(rows-1);  
    }else{  
        alert("无可删除的卡号信息!");  
    }  
} 
Javascript 相关文章推荐
Iframe thickbox2.0使用的方法
Mar 05 Javascript
URL地址中的#符号使用说明
Feb 12 Javascript
php 中序列化和json使用介绍
Jul 08 Javascript
JavaScript中isPrototypeOf函数作用和使用实例
Jun 01 Javascript
javascript实现tab切换的两个实例
Nov 05 Javascript
jQuery.ajax 跨域请求webapi设置headers的解决方案
Aug 08 Javascript
JavaScript实现拖拽元素对齐到网格(每次移动固定距离)
Nov 30 Javascript
JS实现控制图片显示大小的方法【图片等比例缩放功能】
Feb 18 Javascript
javascript中关于类型判断的一些疑惑小结
Oct 14 Javascript
微信小程序时间轴实现方法示例
Jan 14 Javascript
layer页面跳转,获取html子节点元素的值方法
Sep 27 Javascript
vue用ant design中table表格,点击某行时触发的事件操作
Oct 28 Javascript
javascript相等运算符与等同运算符详细介绍
Nov 09 #Javascript
js实现简单登录功能的实例代码
Nov 09 #Javascript
ExtJS实现文件下载的方法实例
Nov 09 #Javascript
简单的两种Extjs formpanel加载数据的方式
Nov 09 #Javascript
5分钟理解JavaScript中this用法分享
Nov 09 #Javascript
Mac地址验证的javascript代码
Nov 09 #Javascript
详解jquery uploadify 上传文件
Nov 09 #Javascript
You might like
初学者入门:细述PHP4的核心Zend
2006/09/05 PHP
php字符串截取的简单方法
2013/07/04 PHP
php+mongodb判断坐标是否在指定多边形区域内的实例
2016/10/28 PHP
Yii2框架实现利用mpdf创建pdf文件功能示例
2019/02/08 PHP
2007/12/23更新创意无限,简单实用(javascript log)
2007/12/24 Javascript
JavaScript 异步调用框架 (Part 6 - 实例 &amp; 模式)
2009/08/04 Javascript
javascript预览上传图片发现的问题的解决方法
2010/11/25 Javascript
在浏览器中获取当前执行的脚本文件名的代码
2011/07/19 Javascript
javascript学习笔记(十九) 节点的操作实现代码
2012/06/20 Javascript
js关闭模态窗口刷新父页面或跳转页面
2012/12/13 Javascript
JS兼容浏览器的导出Excel(CSV)文件的方法
2014/05/03 Javascript
jquery中的常用事件bind、hover、toggle等示例介绍
2014/07/21 Javascript
JS弹出窗口插件zDialog简单用法示例
2016/06/12 Javascript
微信小程序 支付功能开发错误总结
2017/02/21 Javascript
mpvue中使用flyjs全局拦截的实现代码
2018/09/13 Javascript
vue路由守卫+登录态管理实例分析
2019/05/21 Javascript
Javascript实现鼠标移入方向感知
2020/06/24 Javascript
[01:27]2014DOTA2展望TI 剑指西雅图IG战队专访
2014/06/30 DOTA
详解Python中expandtabs()方法的使用
2015/05/18 Python
python解决网站的反爬虫策略总结
2016/10/26 Python
PyCharm安装第三方库如Requests的图文教程
2018/05/18 Python
在python 不同时区之间的差值与转换方法
2019/01/14 Python
python实现转圈打印矩阵
2019/03/02 Python
Python寻找路径和查找文件路径的示例
2019/07/10 Python
pandas数据拼接的实现示例
2020/04/16 Python
Python日志:自定义输出字段 json格式输出方式
2020/04/27 Python
德国BA保镖药房韩文网:kr.ba.de
2017/09/04 全球购物
介绍一下linux的文件权限
2014/07/20 面试题
老师自我鉴定范文
2013/12/25 职场文书
夜不归宿检讨书
2014/02/25 职场文书
计算机毕业生求职信
2014/06/10 职场文书
2014党委书记四风问题对照检查材料思想汇报
2014/09/22 职场文书
2015年中秋寄语
2015/07/31 职场文书
幼师必备:幼儿园期末教师评语50条
2019/11/01 职场文书
Python+Selenium实现读取网易邮箱验证码
2022/03/13 Python
浅谈Redis缓冲区机制
2022/06/05 Redis