选中所有HTML复选框

Question

我有一个小的复选框列表(见下文),我注意到我可以使用type ="reset"的输入元素,它将取消选中所有框.我知道使用输入会比链接的"onClick"事件更好,因为我不会依赖JavaScript,但是对于这个例子,我有两个.

<a onclick="javascript:document.myList.reset();" href="#">select none</a>  |
<a href="#">select all</a>
<form name="myList">
  <input type="checkbox" name="item1"/>Item 1<br/>
  <input type="checkbox" name="item2"/>Item 2<br/>
  <input type="reset" name="none"/>
  <input type="submit" name="submit"/>
</form>

实施"全选"的最佳方式是什么？我可能需要编写一个JavaScript函数,它循环遍历"myList"形式的所有"input"元素,其中type ="checkbox"并将值设置为"0"或其他内容.另外,正确的"跨浏览器"方式是什么？

我假设没有像重置一样的HTML形式这样做？(我找不到一个.)

Answer 1

重置会将其设置为初始状态.这意味着,如果所有复选框都设置为之前已检查,然后更改,则按复位将使它们返回到该状态.

我建议使用jQuery一次更改多个元素:

$("form[name='myList'] :checkbox").attr("checked", true);

或者使用纯JavaScript:

for(var i in document.myList.childNodes)
    if(document.myList.childNodes[i].type == "checkbox")
        document.myList.childNodes[i].checked = true;