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陷阱清单
May 31 Javascript
JavaScript 解析读取XML文档 实例代码
Jul 07 Javascript
JQuery.ajax传递中文参数的解决方法 推荐
Mar 28 Javascript
jQuery点击后一组图片左右滑动的实现代码
Aug 16 Javascript
网页中可关闭的漂浮窗口实现可自行调节
Aug 20 Javascript
Javascript基础之数组的使用
May 13 Javascript
JS使用onerror捕获异常示例
Aug 03 Javascript
JavaScript中关键字 in 的使用方法详解
Oct 17 Javascript
使用typescript开发angular模块并发布npm包
Apr 19 Javascript
JS实现调用本地摄像头功能示例
May 18 Javascript
koa2使用ejs和nunjucks作为模板引擎的使用
Nov 27 Javascript
ionic使用angularjs表单验证(模板验证)
Dec 12 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入门学习知识点五 关于php数组的几个基本操作
2011/07/14 PHP
php全角字符转换为半角函数
2014/02/07 PHP
ThinkPHP实现多数据库连接的解决方法
2014/07/01 PHP
自写的利用PDO对mysql数据库增删改查操作类
2018/02/19 PHP
Laravel-admin之修改操作日志的方法
2019/09/30 PHP
js 优化次数过多的循环 考虑到性能问题
2011/03/05 Javascript
jquery select动态加载选择(兼容各种浏览器)
2013/02/01 Javascript
jQuery查询数据返回object和字符串影响原因是什么
2013/08/09 Javascript
Javascript中引用示例介绍
2014/02/21 Javascript
node.js中的querystring.stringify方法使用说明
2014/12/10 Javascript
Js控制滑轮左右滑动实例
2015/02/13 Javascript
js中flexible.js实现淘宝弹性布局方案
2020/06/23 Javascript
AngularJS 服务详细讲解及示例代码
2016/08/17 Javascript
AngularJS监听路由变化的方法
2017/03/07 Javascript
Js通过AES加密后PHP用Openssl解密的方法
2019/07/12 Javascript
Vue发布项目实例讲解
2019/07/17 Javascript
微信小程序实现分享商品海报功能
2019/09/30 Javascript
javascript实现画板功能
2020/04/12 Javascript
JS中的变量作用域(console版)
2020/07/18 Javascript
[42:52]IG vs VGJ.T 2018国际邀请赛小组赛BO2 第二场 8.18
2018/08/19 DOTA
2款Python内存检测工具介绍和使用方法
2014/06/01 Python
python自然语言编码转换模块codecs介绍
2015/04/08 Python
在Python中操作时间之mktime()方法的使用教程
2015/05/22 Python
Python制作简易注册登录系统
2016/12/15 Python
Python中分支语句与循环语句实例详解
2018/09/13 Python
Python3中内置类型bytes和str用法及byte和string之间各种编码转换 问题
2018/09/27 Python
对python 判断数字是否小于0的方法详解
2019/01/26 Python
pandas修改DataFrame列名的实现方法
2019/02/22 Python
安装docker-compose的两种最简方法
2019/07/30 Python
python-web根据元素属性进行定位的方法
2019/12/13 Python
浅谈opencv自动光学检测、目标分割和检测(连通区域和findContours)
2020/06/04 Python
python 解决pycharm运行py文件只有unittest选项的问题
2020/09/01 Python
python对批量WAV音频进行等长分割的方法实现
2020/09/25 Python
python实现测试工具(一)——命令行发送get请求
2020/10/19 Python
python包的导入方式总结
2021/03/02 Python
党员个人整改方案及措施
2014/10/25 职场文书