Question

我在网上找到了这个代码，它在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>

Answer 1

将处理程序置于代码而不是内联中被认为是最佳做法。您可以保存一些代码，并将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/

Answer 2

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

使用实际的true和false布尔值，它可能会起作用;）

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

2 个答案: