复选框中的 onchange / onclick 在 IE 中不起作用答案

【问题标题】：onchange / onclick in a checkbox doesn't work in IE复选框中的 onchange / onclick 在 IE 中不起作用
【发布时间】：2010-06-25 11:51:33
【问题描述】：

我有以下代码，在 Chrome/FF 中完美运行：

chkbx_send_demo.onchange = function(){
    if(sel_template.selectedIndex <= 0 && chkbx_send_demo.checked == true){
        alert("Choose a Template");
        sel_template.selectedIndex = 1;
    }
    if(chkbx_send_demo.checked == false){
        sel_template.selectedIndex = 0;
     }
}

但它在 IE 中不起作用。我尝试将事件更改为 chkbx_send_demo.onclick，但仍然无法正常工作。

【问题讨论】：

可能您已经检查过了，但是：您确定“chkbx_send_demo”指的是正确的复选框吗？你能发出警报并确认吗？此外，完全相同的代码在 FF 中工作？

标签： javascript html internet-explorer

【解决方案1】：

Internet Explorer 仅在复选框失去焦点 (onblur) 时触发 onchange 事件。也可以在这里查看：
http://krijnhoetmer.nl/stuff/javascript/checkbox-onchange/
在这里：
http://bytes.com/topic/javascript/answers/92116-onchange-checkbox

【讨论】：

IE 行为是正确的，根据关于 onchange 的 HTML 规范“当控件失去输入焦点并且在获得焦点后其值已被修改时，会发生 onchange 事件。此属性适用于以下元素：INPUT，选择和文本区域。” w3.org/TR/REC-html40/interact/scripts.html#adef-onchange

【解决方案2】：

我在 ie8 上遇到了同样的问题，我使用下面的技巧来解决它。 http://sleeplesscoding.blogspot.com/2010/01/fixing-ie-onchange-event-for-checkboxes.html

【讨论】：

【解决方案3】：

您确定 onclick 不起作用？你检查过 javascript 错误吗？

以下工作在IE7中（没有IE6可以测试）

<html>
    <head>
       <script>
            function text()
            {
                alert(document.getElementById("cbxTest").checked);
            }
       </script>
    </head>
    <body>
        <input type="checkbox" name="cbxTest" id="cbxTest" onclick="text()"/>
        <label for="cbxTest"> Test </label>
    </body>
</html>

注意：这仅适用于 onclick。 OnChange 在 IE 中的工作方式不同，请参阅 GOsha 的回答。

【讨论】：

我 100% 确定它不起作用（我在 onclick 函数的每个步骤中都添加了警报）但奇怪的是，当我调试脚本时没有 javascript 错误。
可能您已经检查过了，但是：您确定“chkbx_send_demo”指的是正确的复选框吗？你能发出警报并确认吗？此外，完全相同的代码在 FF 中工作？
我不敢相信，我做了一个警报（chkbx_send_demo.type）；并得到了一个'隐藏'...... document.getElementById("demo") 怎么能得到这个元素：而不是这个： ?? （为什么这只发生在 IE 中？？）但无论如何，谢谢，现在一切都清楚了
那么你是说你有两个具有相同 id 的元素吗？那么我认为没有“标准”行为。确保页面上不同元素的 id 不同。

【解决方案4】：

我的 JS 代码现在是这样的：

if(navigator.appName == "Microsoft Internet Explorer"){
            alert("IE");
            chkbx_send_demo.onclick = function(){
                alert("HI");
                if(sel_template.selectedIndex <= 0 && chkbx_send_demo.checked == true){
                    alert("Choose a Template");
                    sel_template.selectedIndex = 1;
                }
                if(chkbx_send_demo.checked == false){
                    alert("HI");
                    sel_template.selectedIndex = 0;
                }
                alert("HI");
            }
        }
        else
        {
            chkbx_send_demo.onchange = function(){
                if(sel_template.selectedIndex <= 0 && chkbx_send_demo.checked == true){
                    alert("Choose a Template");
                    sel_template.selectedIndex = 1;
                }
                if(chkbx_send_demo.checked == false){
                    sel_template.selectedIndex = 0;
                }
            }
        }

没有 javascript 错误，但代码没有在 IE 上执行，我真的不明白为什么。

【讨论】：

您也可以发布您的 HTML 吗？你是怎么得到chkbx_send_demo的？