`

表格中删除指定行javascript操作

 
阅读更多
	function $(objId){ 
		return document.getElementById(objId); 
	} 
	function del_tbl(tblN,ckN){ 
		var ck = document.getElementsByName(ckN); 
    	var tab = $(tblN);
    	var existCk = false; 
		var rowIndex;
		if(ck){ 
			for(var i=0;i<ck.length;i++){ 
        		if(ck[i].checked){ 
        			existCk = true;
					rowIndex = ck[i].parentNode.parentNode.sectionRowIndex; 
        			tab.deleteRow(rowIndex); 
					i = -1; 
				} 
			} 
		}
		if (!existCk) {
			alert('请选择要删除的记录');
		}
	}

生成表格的javascript:

 function initTable(params){
        	var tableData = "<table id=\"decoderResourceTable\"  class=\"list-table\" align = \"center\"   style=\"margin:0;padding:0;\" cellspacing=\"1\" cellpadding=\"0\">";
        	tableData = tableData + "<tr>";
            tableData = tableData + "<td width=\"8%\" align=\"center\"><input type = \"checkbox\" id = \"checkAllId\" onclick = \"checkAll(this)\"/></td>";
        	tableData = tableData + "<td width=\"12%\" align=\"center\">编号</th>";
        	tableData = tableData + "<td width=\"34%\" align=\"center\">解码设备名称</td>";
        	tableData = tableData + "<td width=\"22%\" align=\"center\">设备类型</td>";
        	tableData = tableData + "<td width=\"24%\" align=\"center\">IP地址</td>";
        	tableData = tableData + "</tr>";
        	
        	for(var i=0; i<params.length; i++){
        		if (params[i] != ""){
        			var rowParams = params[i].split(";");
        			if(rowParams.length == 4){
        			    if( i%2 == 1 ){
        			       tableData = tableData + "<tr class=\"trEven\" align=\"center\" id=\"" + nCol + "\" onClick=\"\";>";
        			    } else {
        			       tableData = tableData + "<tr class=\"trOdd\" align=\"center\" id=\"" + nCol + "\" onClick=\"\";>";  
        			    }				
        				tableData = tableData + "<td class=\"list\"><input id = \"checkboxDecodesId\" type = \"checkbox\" name = \"checkboxRlDecodes\" /></td>";
        				tableData = tableData + "<td class=\"list\">" + nCol + "</td>";
        				tableData = tableData + "<td class=\"text-left\" class=\"list\">" + rowParams[1] + "</td>";
        				tableData = tableData + "<td class=\"text-left\" class=\"list\">" + rowParams[2] + "</td>";
        				tableData = tableData + "<td class=\"text-left\" class=\"list\">" + rowParams[3] + "</td>";
        				tableData = tableData + "<input type=\"hidden\" name=\"decodeResId\" value=\"" + rowParams[0] + "\"/>";
        				tableData = tableData + "<input type=\"hidden\" name=\"typeMtdsId\" value=\"" + rowParams[2] + "\"/>";
        				tableData = tableData + "</tr>";
        				nCol++;
        			}
        		}
        	}
        	tableData = tableData + "</table>";
        	old_Decoder = null;
        	
        	return tableData;
        }


全选所有checkBox的操作

function checkAll(chk){
   			var chkArray;
   			chkArray=document.getElementsByName("checkboxRlDecodes");
   			if(chk){
   			if(chkArray){
   				for(var i=0;i<chkArray.length;i++){
   					chkArray[i].checked=chk.checked;
   				}
  		 	}
  		 	}
		}
分享到:
评论

相关推荐

    js操作table元素,表格的行列新增、删除汇集.txt

    js操作table元素,表格的行列新增、删除汇集.txt

    JS实现动态删除HTML表格数据.html

    本文介绍了一个通过按钮操作删除HTML表格中的一行数据的功能,同时使用了JavaScript的数组删除数据。在这个功能中,我们首先定义了一个包含数据的二维数组,然后在HTML中生成一个表格来显示这些数据。通过使用...

    程序天下:JavaScript实例自学手册

    9.31 删除表格指定行 9.32 设置表格的交替行颜色 9.33 双击单元格变为可编辑 9.34 鼠标经过表格时列变色 9.35 鼠标选择表格中的多行 9.36 使用JavaScript向表格中写入数据 9.37 类C# GridView的编辑效果(一) 9.38 ...

    《程序天下:JavaScript实例自学手册》光盘源码

    9.31 删除表格指定行 9.32 设置表格的交替行颜色 9.33 双击单元格变为可编辑 9.34 鼠标经过表格时列变色 9.35 鼠标选择表格中的多行 9.36 使用JavaScript向表格中写入数据 9.37 类C# GridView的编辑效果(一) 9.38 ...

    javascript实现筛选、合并表格

    实现根据条件筛选行(删除多余行),再根据条件(以当前单元格与同列的上一行相同,则向上合并单元格举例)合并指定单元格。

    JavaScript网页特效范例宝典源码

    实例205 在表格中添加行及单元格 322 实例206 删除表中的单元格 324 7.5 表格的特殊效果 325 实例207 透明表格 326 实例208 限制表格的宽度 327 实例209 表格的标题 328 实例210 表格的外阴影 329 实例211 立体表格 ...

    JavaScript完全自学宝典 源代码

    16.4.html 在JavaScript中使用FileSystemObject操作本地文件的方法。 第18章(\c18) 示例描述:学习XMLHttpRequest对象。 18.1.html 使用Ajax获取HTTP头信息。 18.2.html 使用Ajax获取全部响应头信息...

    JS实现页面创建表格.rar

    实现页面创建表格,和删除指定列、行单元格功能。利用JavaScript动态创建表格,可根据用户的使用需求动态添加指定列数、行数,删除指定列数、行数。删除成功或不成功时,会反馈给用户一个弹框提示,增强用户体验感。

    javascript完全学习手册1 源码

    第9章 JavaScript中的XML 223 9.1 XML语言 223 9.1.1 XML概述 223 9.1.2 XML文档结构 225 9.1.3 XML标记 226 9.1.4 XML文档元素 226 9.1.5 XML属性 229 9.1.6 XML命名空间 230 9.2 XML DOM 231 9.2.1 通用接口 232 ...

    javascript动态行(代码清晰易懂)

    实现在table表格的指定行后增加新行 删除新行 并利用收回及展开处理了由于动态增加行而占用大量页面空间的问题 代码有注释 易懂 希望能对大家有所帮助

    javascript网页特效实例大全(13-19)

    实例324 控制表格指定外边框不显示 518 实例325 背景颜色渐变的表格 520 实例326 表格隔行变色 521 13.3 鼠标及滚动条样式 522 实例327 显示自定义鼠标形状 522 实例328 动画光标 524 实例329 制作彩色...

    javascript完全学习手册2 源码

    第9章 JavaScript中的XML 9.1 XML语言 9.1.1 XML概述 9.1.2 XML文档结构 9.1.3 XML标记 9.1.4 XML文档元素 9.1.5 XML属性 9.1.6 XML命名空间 9.2 XMLDOM 9.2.1 通用接口 9.2.2 IE中的XMLDOM支持 ...

    CRUD-Web-Page:使用JavaScript实现基本的CRUD操作

    DELETE 过程:删除 WHERE 子句中的指定行。此存储库包含 4 个名为的子文件夹:- 图片文件夹CSS文件夹JavaScript 文件夹HTML页面图像文件夹包含网页的背景图像。 css 文件夹包含“style.css”文件,其中包含用于样式...

    JavaScript实现动态添加、移除元素或属性的方法分析

    删除元素的某个指定的子节点,并以 Node 对象返回被删除的节点,如果节点不存在则返回 null。 innerHTML 属性设置或返回表格行的开始和结束标签之间的 HTML。 测试用例 &lt;html&gt; &lt;head&gt;

    JavaScript王者归来part.1 总数2

     10.1.2 JavaScript中的正则表达式   10.2 正则表达式的规则   10.2.1 直接量字符   10.2.2 字符类和布尔操作   10.2.3 重复   10.2.4 选择、分组和引用   10.2.5 指定匹配的位置   10.2.6 标志——...

    JavaScript实现添加及删除事件的方法小结

    JavaScript添加、删除事件的方法,也就是让某些方法生效指定次数,可以是一次、两次或更多次,但指定次数执行完毕后就删除该方法,使其失效,如果你经常从事JS编程,你就会知道这种功能用得比较多。 先来看看一个...

    JavaScript笔记

    15.JavaScript中的所有事物都是对象,分为三类: |--简单对象:String、Number、Boolean |--组合对象:Array、Math、Date |--复杂对象:Function、Regex、Object等 16.Array排序: |--升序:function compare(a...

    ASP.NET基础控件-教程

     Asp.net手动绑定数据(分页、编辑、删除、加控件等操作)  Asp.net中My97DatePicker4.2日期的使用  Asp.net中DataList控件添加删除  Asp.net获取请求的用户信息IP地址  获取世界IP地址库显所在城市信息  MySQL...

    excellentexport:将JavaScript导出到Excel

    ExcellentExport.js JavaScript导出到Excel或CSV。 一个快速JavaScript库,用于从浏览器中HTML表创建导出到Excel / CSV。 无需服务器。 ... 删除ES6函数语法以支持IE11 更新npm依赖关系以修复

Global site tag (gtag.js) - Google Analytics