Question

我正在尝试通过标记为“全选”的复选框上的onclick事件检查所有复选框。代码在FF，Chrome中工作正常，但在IE中无效。代码如下：

<script type="text/javascript">
function toggle(source) {
checkboxes = document.getElementsByName('category');
for(var i in checkboxes)
 checkboxes[i].checked = source.checked;
}
</script>

<input type="checkbox" name="selectAll" id="selectAll" onClick="javascript :toggle(this)" />Select All Categories

<input type="checkbox" name="category" id="category1" />category1
<input type="checkbox" name="category" id="category2" />category2
<input type="checkbox" name="category" id="category3" />category3

任何帮助都将不胜感激。

Answer 1

放入jsFiddle的这个清理版本在IE中工作正常：http://jsfiddle.net/jfriend00/m7T2S/。

function toggle(source) {
    var checkboxes = document.getElementsByName('category');
    for (var i = 0; i < checkboxes.length; i++)
        checkboxes[i].checked = source.checked;
}

因此，您的实际页面中肯定会有其他内容未显示给我们。

我对您的代码进行的清理是：

将复选框声明为局部变量，因此它不会意外地成为全局变量。
使用for (var i = 0; i < array.length; i++)循环遍历复选框数组。永远不应该使用(for i in array)迭代数组，因为它会迭代对象的属性，而不仅仅是数组元素。
HTML中的事件处理程序不需要javascript:前缀。

Answer 2

如果它的形式，那么你可以这样做而不是getElementsByName：


function toggle(source) {
    var field = document.formname.category;
    for (i = 0; i < field.length; i++) {
       field[i].checked = source.checked;
    }
}

Answer 3

用下面的

替换你的功能

function toggle(source)
{ 
    checkboxes = document.getElementsByName('category'); 
    for(i=0;i<checkboxes.length;i++)
    checkboxes[i].checked = source.checked;
}

适用于IE8，我已经测试过了。

使用javascript检查所有复选框在IE中不起作用

3 个答案: