CheckBox-复选框-删除-选中行
<!--删除选中的行,利用oTable.deleteRow(i)方法-->
<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
<title></title>
<script>
window.onload = function ()
{
var oBtn = document.getElementById('Button1'); //获取ID为按钮
var oTable = document.getElementById('table1'); //获取ID为表格
var oCheckbox = document.getElementsByName('checkbox');//获取所有的name值为CheckBox
//单击按钮的事件
oBtn.onclick = function () {
for (var i = 0; i < oCheckbox.length; i++) { //遍历所有的复选框为选中的
if (oCheckbox[i].checked) { //如果选中
oTable.deleteRow(i); //删除选中的行
}
}
}
}
</script>
</head>
<body>
<table id="table1">
<tr>
<td>
<input id="Checkbox2" type="checkbox" name="checkbox"/>
</td>
<td>1</td>
<td>i</td>
<td>你好</td>
</tr>
<tr>
<td>
<input id="Checkbox3" type="checkbox" name="checkbox" />
</td>
<td>2</td>
<td>y</td>
<td>世界</td>
</tr>
<tr>
<td>
<input id="Checkbox4" type="checkbox" name="checkbox" />
</td>
<td>3</td>
<td>x</td>
<td>你好世界</td>
</tr>
<tr>
<td>
<input id="Button1" type="button" value="删除" />
</td>
</tr>
</table>
</body>
</html>2018-06-19
CheckBox-复选框-删除-选中行的更多相关文章
- checkbox复选框全选批量删除
多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...
- easyui datagrid 通过复选框删除新追加的数据问题
之前写好的功能在保存好数据后再通过复选框删除是没有问题的,可现在想多追加几行,然后选择删除新追加的某几行或一行,通过$('#dg').datagrid('getChecked')方法返回选中行,然而返 ...
- jQuery 复选框全选/取消全选/反选
jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...
- js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中
<!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...
- JavaScript小例子：复选框全选
JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...
- Jquery表格变色 复选框全选，反选
/*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...
- 复选框全选、全不选和反选的效果实现VIEW:1592
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- html+css+js实现复选框全选与反选
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- 关于MUI v0.18.0版本 Table组件里的复选框不能选的解决方案
前段时间在用MUI的时候,Table组件出现复选框不能选的bug(描述: 点击复选框,点击事件会触发,复选框勾选状态无变化). 解决方法: 用CheckBox组件代替Table组件自带的复选框. 解决 ...
随机推荐
- veri HDL modeisim仿真：test bench文件编写
预编译指令: verilog HDL预编译指令是以" ' "字符开头,而且不需要以";"结尾. 作用:指示在编译verilog hdl源代码前,需要执行哪些操作 ...
- 推荐使用OpenLiveWriter在cnblogs上写的Blog
这是我第一个使用OpenLiveWriter在cnblogs上写的Blog.不知道效果如何,但又很多功能我可以采用! 如表格功能: Open Live Writer Write on Web 优 ...
- 背水一战 Windows 10 (82) - 用户和账号: 获取用户的信息, 获取用户的同意
[源码下载] 背水一战 Windows 10 (82) - 用户和账号: 获取用户的信息, 获取用户的同意 作者:webabcd 介绍背水一战 Windows 10 之 用户和账号 获取用户的信息 获 ...
- [.net core学习] .net core中的MD5CryptoServiceProvider取代方法
使用:MD5 m5 = MD5.Create(); 参考:http://stackoverflow.com/questions/27216121/alternatives-of-md5cryptose ...
- JVM活学活用——调优工具
概述 工具做为图形化界面来展示更能直观的发现问题,另一方面一些耗费性能的分析(dump文件分析)一般也不会在生产直接分析,往往dump下来的文件达1G左右,人工分析效率较低,因此利用工具来分析jvm相 ...
- String的substring方法
string.substring(beginIndex, endIndex) 左闭右开. 测试 public static void main(String[] args) { String a = ...
- Android交流会-碎片Fragment，闲聊单位与尺寸
女孩:又周末了哦~ 男孩:那么今日来开个交流会,我们也学一学人家高大尚的大会,自己开一个,广州站,Android开发攻城狮交流会~ 1.Fragment概要: Android从3.0开始引入了Frag ...
- Shell-10--if
- Docker 与 虚拟机比较
1, 更高效的利用系统资源2,更快速的启动时间3,一致的运行环境4,持续交付(Continuous Integration)和部署(Continuous Delivery) 5, 更轻松的迁移 6,更 ...
- python中基于queue的打印机仿真算法
使用打印机的模型是queue中最经典的应用之一,这里就回顾一下queue在这里的使用方法和 起的重要作用. 为了仿真打印状态,这里需要把真实环境中的三个物理模型要建模出来,分别是:打印者,打印 任务, ...