在網(wǎng)站開(kāi)發(fā)中，經(jīng)常需要對(duì)記錄進(jìn)行批量操作，其中一個(gè)常見(jiàn)需求是用JavaScript在客戶端將待刪除的記錄全部選中，然后在服務(wù)器端執(zhí)行相應(yīng)的操作。通常情況下，我們會(huì)操作checkbox復(fù)選框來(lái)實(shí)現(xiàn)這一功

在網(wǎng)站開(kāi)發(fā)中，經(jīng)常需要對(duì)記錄進(jìn)行批量操作，其中一個(gè)常見(jiàn)需求是用JavaScript在客戶端將待刪除的記錄全部選中，然后在服務(wù)器端執(zhí)行相應(yīng)的操作。通常情況下，我們會(huì)操作checkbox復(fù)選框來(lái)實(shí)現(xiàn)這一功能。下面通過(guò)一個(gè)具體實(shí)例來(lái)詳細(xì)說(shuō)明。

實(shí)例HTML代碼

假設(shè)有一個(gè)產(chǎn)品表格，包含“產(chǎn)品名稱”和“價(jià)格”兩個(gè)字段，每條記錄前都有一個(gè)用于選中的checkbox。此外，表格底部還有一個(gè)用于全選的checkbox（name"selectAll"）。表格的結(jié)構(gòu)是通過(guò)dl、dt、dd以及CSS來(lái)實(shí)現(xiàn)的，具體的代碼如下：

```html

選擇產(chǎn)品名稱價(jià)格

數(shù)碼相機(jī)

2200

筆記本電腦

3500

電腦硬盤

420

```

使用JavaScript實(shí)現(xiàn)全選功能

當(dāng)單擊“全選”前面的checkbox（name"selectAll"）時(shí)，通過(guò)JavaScript循環(huán)的方式將所有記錄都選中。具體思路如下：

首先，獲取表格的父對(duì)象（pID），然后選擇該范圍內(nèi)所有類型為input的HTML標(biāo)簽，并循環(huán)遍歷所有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;

}

}

}

```

調(diào)用上述方法即可實(shí)現(xiàn)全選功能，該方法經(jīng)過(guò)驗(yàn)證兼容主流瀏覽器，使用方便。無(wú)論表格采用何種形式實(shí)現(xiàn)，只要將表格的ID傳遞給selectAllCheckBox方法，就能實(shí)現(xiàn)批量選中的效果。