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 相关文章推荐
Packer 3.0 JS压缩及混淆工具 下载
May 03 Javascript
CSS+Table图文混排中实现文本自适应图片宽度(超简单+跨所有浏览器)
Feb 14 Javascript
javascript Excel操作知识点
Apr 24 Javascript
js 数组实现一个类似ruby的迭代器
Oct 27 Javascript
Ubuntu 11.10 安装Node.js的方法
Nov 30 Javascript
浅谈javascript六种数据类型以及特殊注意点
Dec 20 Javascript
jQuery中extend()和fn.extend()方法详解
Jun 03 Javascript
JavaScript获取页面中超链接数量的方法
Nov 09 Javascript
NPM 安装cordova时警告:npm WARN deprecated minimatch@2.0.10: Please update to minimatch 3.0.2 or higher to
Dec 20 Javascript
详解使用Node.js 将txt文件转为Excel文件
Jul 05 Javascript
微信小程序开发之IOS和Android兼容的问题
Sep 26 Javascript
JavaScript插件Tab选项卡效果
Nov 14 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内核探索之变量
2015/12/22 PHP
php实现简单加入购物车功能
2017/03/07 PHP
php PDO判断连接是否可用的实现方法
2017/04/03 PHP
nicejforms——美化表单不用愁
2007/02/20 Javascript
Javascript 的addEventListener()及attachEvent()区别分析
2009/05/21 Javascript
div+css布局的图片连续滚动js实现代码
2010/05/04 Javascript
JavaScript对象和字串之间的转换实例探讨
2013/04/21 Javascript
给超链接添加特效鼠标移动展示提示信息且随鼠标移动
2013/10/17 Javascript
js实现数组去重、判断数组以及对象中的内容是否相同
2013/11/29 Javascript
javascript中的undefined和not defined区别示例介绍
2014/02/26 Javascript
浅谈JavaScript中的String对象常用方法
2015/02/25 Javascript
快速获取/设置iframe内对象元素的几种js实现方法
2016/05/20 Javascript
详解Jquery 遍历数组之$().each方法与$.each()方法介绍
2017/01/09 Javascript
Bootstrap实现渐变顶部固定自适应导航栏
2020/08/27 Javascript
jQuery插件FusionCharts实现的3D柱状图效果实例【附demo源码下载】
2017/03/03 Javascript
详解vue-router基本使用
2017/04/18 Javascript
利用Vue.js+Node.js+MongoDB实现一个博客系统(附源码)
2017/04/24 Javascript
基于JS实现仿京东搜索栏随滑动透明度渐变效果
2017/07/10 Javascript
js实现菜单跳转效果
2020/12/11 Javascript
[05:08]2014DOTA2国际邀请赛 Hao专访复仇的胜利很爽
2014/07/15 DOTA
python实现在windows服务中新建进程的方法
2015/06/30 Python
Fabric 应用案例
2016/08/28 Python
Python 普通最小二乘法(OLS)进行多项式拟合的方法
2018/12/29 Python
Django集成CAS单点登录的方法示例
2019/06/10 Python
nginx+uwsgi+django环境搭建的方法步骤
2019/11/25 Python
Python的形参和实参使用方式
2019/12/24 Python
Python实现屏幕录制功能的代码
2020/03/02 Python
Linux安装Python3如何和系统自带的Python2并存
2020/07/23 Python
Python实现扫码工具的示例代码
2020/10/09 Python
屈臣氏乌克兰:Watsons UA
2019/10/29 全球购物
我爱我家教学反思
2014/05/01 职场文书
辞职信格式模板
2015/02/27 职场文书
Java 在线考试云平台的实现
2021/11/23 Java/Android
Oracle使用别名的好处
2022/04/19 Oracle
Android 界面一键变灰 深色主题工具类
2022/04/28 Java/Android
windows系统安装配置nginx环境
2022/06/28 Servers