php++js+复选框选中,Js把全部 checkbox 选中

批量删除网站记录时,通常要用 js 在客户端把待删除的记录全部选中,再在服务器端把选择的记录都删除。而选中记录一般都是选中记录前的 checkbox 复选框,为易于理解,下面用一个实例具体说明。

1、实例 HTML 代码

假如有一张产品表格,它是由“产品名称”和“价格”2个字段组成,此外前面还有一个供选中记录的 checkbox;表格的下面还有一个选中所有记录的 checkbox(name="selectAll")。该表格是 dl dt dd + css 实现的,具体代码如下:

选择 产品名称 价格
数码相机
2200
type"checkbox" />
笔记本电脑
3500
电脑硬盘
420
全选

2、用Js一个简单的方法把全部 checkbox 选中

当单击“全选”前面的 checkbox(name="selectAll")时,js 通过循环的方式把所有记录都选中,具体思路如下:

首先,获得表格的父对象(pID),再选择该范围内的所有类型为 input 的 HTML 标签,然后循环遍历所有 input,如果类型是 checkbox,则选中,代码如下:

//ParentID 是表格本身的ID或表格的父ID

//bool 是 checkbox 当前状态(选中还是未选中)

function selectAllCheckBox(ParentID, bool)

{

var pID = document.getElementById(ParentID);

var cb = pID.getElementsByTagName("input");

for(var i = 0;i < cb.length; i++){

if(cb[i].type == "checkbox")

cb[i].checked = bool;

}

}

调用方法:selectAllCheckBox('product',this.checked);//见HTML代码最后一行

该方法经过验证没有错误,且兼容 Ie、Edge、Chrome、Firefox 等主流浏览器,直接就可以调用,十分方便。

最后说明一点:例中是用 dl dt dd + css 实现的表格,其实用什么表格都没有关系,只要把“表格本身的ID或表格的父ID” 传递给selectAllCheckBox 方法,都可以全部选中。

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值