Question

我在HTML中有以下复选框：

＆＃13;

function updateSettings(id, bit) {
  alert('0');
}

＆＃13;

<input type="checkbox" onclick="alert('1');updateSettings(0, 1);alert('2');" />

＆＃13;

在IE11中点击我得到警报1,2但不是0：该功能根本没有执行。

在Chrome中，一切正常。

Answer 1

函数updateSettings在IE document对象上定义。请参阅此documentaion。

当您将内联调用（如本例中的onclick）调用时，如果定义了函数，它将首先查看元素本身。然后它将搜索DOM树到document以查看函数是否已定义（某些元素被搜索而某些元素未被搜索，不幸的是，在@ user4749485写道之前，我还不知道管理此规则的规则他的评论，以及之后，作为window的最后手段。它发现它，它运行它。

由于您可能在全局对象（window）上定义了自己的updateSettings，因此不会在IE中触发它，因为首先找到document对象上定义的函数。

神秘虫的结束： - ）

更新：

@ user4749485指向在w3 site解释此链接的链接，信息在项目1.10 - Lexical Environment Scope中。总结一下：

<element onclick="functionFoo();">bar</element>

意味着以下程序：

Does element.functionFoo exist ?  YES ==> use this function.
ELSE
Does element belong(1) to a form and form.functionFoo exist ? YES ==> use this function.
ELSE
Does document.functionFoo exist ?  YES ==> use this function.
ELSE
Does window.functionFoo exist ?  YES ==> use this function.
ELSE
crash.

（1）=一个元素属于一个表单！=一个元素在一个表单元素中。粗略地说，它必须是一个表单元素，就像在输入元素的问题中一样。

Answer 2

发现了这个问题，但这很有意思。如果将函数名称更改为小写，则可以正常工作。

function updatesettings(id, bit) {
  alert('0');
}

<input type="checkbox" onclick="alert('1');updatesettings(0, 1);alert('2');" />

DEMO ：http://codepen.io/anon/pen/YXLgxJ

更新：正如Zimmi解释 updateSettings 是IE中的内置方法document.updateSettings()，这将在onclick事件而不是我们的事件上触发方法window.updateSettings()

Answer 3

我建议不要使用内联onclick事件，而是使用jquery为复选框定义一个事件：

    function updateSettings(id, bit) {
        alert('0');
    }

    jQuery(document).ready(function(){
         jQuery("#cbMyCheckbox").click(function(){
              alert('1');
              updateSettings(0, 1);
              alert('2');
         });
    });

然后在你的HTML中：

    <input type="checkbox" id="cbMyCheckbox" />

在IE

3 个答案: