javascript实现“;“全选”;复选框在IE中不起作用

javascript implement "select all" check box not working in IE

本文关键字:IE 不起作用 实现 全选 javascript 复选框      更新时间:2023-09-26

我在网上找到了这个代码,它在Firefox和Chrome上还可以,但在IE上不起作用,有人知道如何为IE修复它吗?

按钮的值确实会切换,但只有复选框无法更改

<html>
<head>
<script type="text/javascript">
    function do_this(){
        var checkboxes = document.getElementsByName('approve[]');
        var button = document.getElementById('toggle');
        if(button.value == 'select'){
            for (var i in checkboxes){
                checkboxes[i].checked = 'FALSE';
            }
            button.value = 'deselect'
        }else{
            for (var i in checkboxes){
                checkboxes[i].checked = '';
            }
            button.value = 'select';
        }
    }
</script>
</head>
<body>
<input type="checkbox" name="approve[]" value="1" />
<input type="checkbox" name="approve[]" value="2" />
<input type="checkbox" name="approve[]" value="3" />
<input type="button" id="toggle" value="select" onClick="do_this()" />
</body>
</html>

将处理程序放在代码中而不是内联被认为是最佳实践。您可以保存一些代码,并将onclick处理程序放在您的代码中,如下所示:

// add event handler
function init() {
    document.getElementById('toggle').onclick = function () {
        do_this(this);
    };
}
window.onload = init;
// me is the button here
function do_this(me) {
    var checkboxes = document.getElementsByName('approve[]');
    for (var i = 0; i < checkboxes.length; i++) {
        // toggle to what it is not
        checkboxes[i].checked = !checkboxes[i].checked;
    }
    me.value = me.value == 'select' ? 'deselect' : 'select';
}

示范小提琴的动作:http://jsfiddle.net/qK2qS/

必须将布尔值传递给checked属性。其他浏览器正在理解您奇怪的逻辑,并将'FALSE'转换为布尔型true(选中复选框),将''转换为false(取消选中)

使用实际的truefalse布尔值,它可能只起作用;)