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组件自带的复选框. 解决 ...
随机推荐
- CentOS7：ifconfig command not found解决
https://blog.csdn.net/dandelion_drq/article/details/53503487
- mysql8.0 linux 安装
1.下载 mysql-8.0.15-linux-glibc2.12-x86_64.tar.xz 2.解压 tar -xvf mysql-8.0.15-linux-glibc2.12-x86_64.ta ...
- pycharm 如何进行全部搜索
界面里面先按ctrl F 弹出搜索页面 在搜索框内连续按两次shift shift可以搜索全文
- 02-jQuery的选择器
我们以前在CSS中学习的选择器有: 今天来学习一下jQuery 选择器. jQuery选择器是jQuery强大的体现,它提供了一组方法,让我们更加方便的获取到页面中的元素. 1.jQuery 的基本选 ...
- css概括
CSS:美化页面 层叠样式表 修改标签样式 1.分类:内联 内嵌 外部引用 (1)内联: 写在标签里面,以属性的形式表现 属性名为style (2)内嵌:写在head标签里面,以标签 ...
- RabbitMQ基本理论
本节内容 一 RabbitMQ介绍 二 RabbitMQ安装配置 三 RabbitMQ的Python实现-pika 1. 生产者消费者 2. 工作队列 3. 持久化和公平分发 4. 发布与订阅 ...
- C++数组,sort
cmake_minimum_required(VERSION 3.5) project(Test) add_executable( te test.cpp ) test.cpp #include &l ...
- Maven - 实例-2-使用本地仓库中的依赖包
Maven引入构建包的流程 执行mvn compile命令编译源代码,如果编译过程中需要用到其他的包, maven将会在pom.xml文件中查找是否引入该依赖包的坐标. 示例: <depende ...
- iOS开发笔记－根据frame大小动态调整fontSize的自适应文本及圆形进度条控件的实现
最近同样是新App,设计稿里出现一种圆形进度条的设计,如下: 想了想,圆形进度条实现起来不难,但是其中显示百分比的文本确需要自适应,虽然可以使用时自己设定文本字体的大小,但是这样显得很麻烦,也很low ...
- Thymeleaf教程入门到深入1:基础介绍
1 介绍 1.1 简介 Thymeleaf是一个用于Web和独立Java环境的模板引擎,能够处理HTML.XML.JavaScript.CSS甚至纯文本.能轻易的与Spring MVC等Web框架进行 ...