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 相关文章推荐
VBScript版代码高亮
Jun 26 Javascript
Js event事件在IE、FF兼容性问题
Jan 01 Javascript
js返回上一页并刷新代码整理
Dec 21 Javascript
JS实现简单的顶部定时关闭层效果
Jun 15 Javascript
基于jquery实现下拉框美化特效
Feb 02 Javascript
JavaScript 经典实例日常收集整理(常用经典)
Mar 30 Javascript
Javascript闭包与函数柯里化浅析
Jun 22 Javascript
angular4 JavaScript内存溢出问题
Mar 06 Javascript
详解axios中封装使用、拦截特定请求、判断所有请求加载完毕)
Apr 09 Javascript
JS实现躲避粒子小游戏
Jun 18 Javascript
使用Mock.js生成前端测试数据
Dec 13 Javascript
Vue中Object.assign清空数据报错的解决方案
Mar 03 Vue.js
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
调频问题解答
2021/03/01 无线电
PHP 5昨天隆重推出--PHP 5/Zend Engine 2.0新特性
2006/10/09 PHP
php的chr和ord函数实现字符加减乘除运算实现代码
2011/12/05 PHP
php进行ip地址掩码运算处理的方法
2016/07/11 PHP
PHP cookie,session的使用与用户自动登录功能实现方法分析
2019/06/05 PHP
javascript 学习之旅 (1)
2009/02/05 Javascript
js 自定义的联动下拉框
2010/02/07 Javascript
封装的原生javascript弹出层代码
2010/09/24 Javascript
Js 去掉字符串中的空格(实现代码)
2013/11/19 Javascript
JQUERY 设置SELECT选中项代码
2014/02/07 Javascript
JSON+HTML实现国家省市联动选择效果
2014/05/18 Javascript
jQuery插件实现文件上传功能(支持拖拽)
2020/08/27 Javascript
关于JSON.parse(),JSON.stringify(),jQuery.parseJSON()的用法
2016/06/30 Javascript
在JSP中如何实现MD5加密的方法
2016/11/02 Javascript
AngularJS Select(选择框)使用详解
2017/01/18 Javascript
Vue封装Swiper实现图片轮播效果
2018/02/06 Javascript
ES6 Promise对象的应用实例分析
2019/06/27 Javascript
[46:40]VGJ.T vs Winstrike 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/20 DOTA
Python xlrd读取excel日期类型的2种方法
2015/04/28 Python
Pycharm技巧之代码跳转该如何回退
2017/07/16 Python
详解Python字典的操作
2019/03/04 Python
Python调用Windows API函数编写录音机和音乐播放器功能
2020/01/05 Python
美国奢侈品购物平台:Orchard Mile
2018/05/02 全球购物
JBL英国官网:JBL UK
2018/07/04 全球购物
阿联酋航空丹麦官方网站:Emirates DK
2019/08/25 全球购物
在阿联酋购买翻新手机和平板电脑:Teckzu
2021/02/12 全球购物
护士进修自我鉴定
2014/02/07 职场文书
环保建议书100字
2014/05/14 职场文书
课内比教学心得体会
2014/09/09 职场文书
骨干教师事迹材料
2014/12/17 职场文书
学生考试舞弊检讨书
2015/01/01 职场文书
优秀团员个人总结
2015/02/26 职场文书
国王的演讲观后感
2015/06/03 职场文书
家长对学校的意见和建议
2015/06/03 职场文书
Python 正则模块详情
2021/11/02 Python
MySQL 外连接语法之 OUTER JOIN
2022/04/09 MySQL