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 相关文章推荐
javascript实现原生ajax的几种方法介绍
Sep 21 Javascript
jQuery中使用Ajax获取JSON格式数据示例代码
Nov 26 Javascript
jquery uploadify 在FF下无效的解决办法
Sep 26 Javascript
JS实现简单的键盘打字的效果
Apr 24 Javascript
javascript中JSON对象与JSON字符串相互转换实例
Jul 11 Javascript
AngularJS入门教程引导程序
Aug 18 Javascript
js实现图片淡入淡出切换简易效果
Aug 22 Javascript
VUE 全局变量的几种实现方式
Aug 22 Javascript
javascript实现文本框标签验证的实例代码
Oct 14 Javascript
javascript实现5秒倒计时并跳转功能
Jun 20 Javascript
JS实现提示框跟随鼠标移动
Aug 27 Javascript
nuxt配置通过指定IP和端口访问的实现
Jan 08 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
PHP 开发工具
2006/12/06 PHP
提高PHP编程效率的53个要点(经验小结)
2010/09/04 PHP
去掉destoon资讯内容页keywords关键字自带的文章标题的方法
2014/08/21 PHP
PHP中echo和print的区别
2014/08/28 PHP
php选择排序法实现数组排序实例分析
2015/02/16 PHP
全面解读PHP的人气开发框架Laravel
2015/10/15 PHP
PHP基于递归实现的约瑟夫环算法示例
2017/08/27 PHP
基于ThinkPHP5.0实现图片上传插件
2017/09/25 PHP
PHP高效获取远程图片尺寸和大小的实现方法
2017/10/20 PHP
基于laravel belongsTo使用详解
2019/10/18 PHP
去除链接虚线全面分析总结
2006/08/15 Javascript
几个比较经典常用的jQuery小技巧
2010/03/01 Javascript
js href的用法
2010/05/13 Javascript
jQuery+Ajax+PHP弹出层异步登录效果(附源码下载)
2016/05/27 Javascript
JS动态计算移动端rem的解决方案
2016/10/14 Javascript
js制作支付倒计时页面
2016/10/21 Javascript
jquery二级目录选中当前页的css样式
2016/12/08 Javascript
微信小程序 动态的设置图片的高度和宽度详解及实例代码
2017/02/24 Javascript
webpack实用小功能介绍
2018/01/02 Javascript
在vue项目中使用codemirror插件实现代码编辑器功能
2019/08/27 Javascript
[01:27:43]VGJ.S vs TNC Supermajor 败者组 BO3 第三场 6.6
2018/06/07 DOTA
[01:08:30]DOTA2-DPC中国联赛 正赛 Ehome vs Elephant BO3 第一场 2月28日
2021/03/11 DOTA
Python中音频处理库pydub的使用教程
2017/06/07 Python
Python中的浮点数原理与运算分析
2017/10/12 Python
python sys,os,time模块的使用(包括时间格式的各种转换)
2018/04/27 Python
Pycharm快捷键配置详细整理
2020/10/13 Python
什么是makefile? 如何编写makefile?
2012/08/08 面试题
马智宇婚礼主持词
2014/03/22 职场文书
幼儿园大班家长评语
2014/04/17 职场文书
安全目标管理责任书
2014/07/25 职场文书
2014年政教处工作总结
2014/12/20 职场文书
助学感谢信范文
2015/01/21 职场文书
公司客户答谢酒会祝酒词
2015/08/11 职场文书
2016大学生入党积极分子心得体会
2016/01/06 职场文书
严以律己学习心得体会
2016/01/13 职场文书
Nginx同一个域名配置多个项目的实现方法
2021/03/31 Servers