使用JavaScript实现批量选择Checkbox

在网站开发中，经常需要对记录进行批量操作，其中一个常见需求是用JavaScript在客户端将待删除的记录全部选中，然后在服务器端执行相应的操作。通常情况下，我们会操作checkbox复选框来实现这一功能。下面通过一个具体实例来详细说明。

实例HTML代码

假设有一个产品表格，包含“产品名称”和“价格”两个字段，每条记录前都有一个用于选中的checkbox。此外，表格底部还有一个用于全选的checkbox（name"selectAll"）。表格的结构是通过dl、dt、dd以及CSS来实现的，具体的代码如下：

```html

选择产品名称价格

数码相机

2200

笔记本电脑

3500

电脑硬盘

420

```

使用JavaScript实现全选功能

当单击“全选”前面的checkbox（name"selectAll"）时，通过JavaScript循环的方式将所有记录都选中。具体思路如下：

首先，获取表格的父对象（pID），然后选择该范围内所有类型为input的HTML标签，并循环遍历所有input。如果类型是checkbox，则选中。具体代码如下：

```javascript

function selectAllCheckBox(pID, isChecked) {

var parent (pID);

var checkboxes ("input");

for (var i 0; i < checkboxes.length; i ) {

if (checkboxes[i].type "checkbox") {

checkboxes[i].checked isChecked;

}

}

}

```

调用上述方法即可实现全选功能，该方法经过验证兼容主流浏览器，使用方便。无论表格采用何种形式实现，只要将表格的ID传递给selectAllCheckBox方法，就能实现批量选中的效果。

版权声明：本文内容由互联网用户自发贡献，本站不承担相关法律责任.如有侵权/违法内容,本站将立刻删除。