javascript - 简单的 jQuery 单击事件绑定(bind)在 IE8 中不起作用

Question

这似乎适用于几乎所有浏览器，除了 IE8(可能还有 IE7，但我还没有尝试过)，我不确定为什么。

$('body')
    .on('click', '.toggle', function(e){
        $(this).toggleClass('active');
        e.preventDefault();
        e.stopPropagation();
    });

当我点击分类为 toggle 的链接时，我注意到了，尽管有 e.preventDefault()，浏览器仍会转到页面顶部.在调查问题时，我看到了诸如返回 false 或设置 event.returnValue = false 之类的解决方案。 .我通过首先测试 e.preventDefault() 来尝试这两种方法如果不满足条件，则执行备选方案。

设置返回值:

$('body')
    .on('click', '.toggle', function(e){
        if (e.preventDefault()) {
                e.preventDefault();
            } else {
                e.returnValue = false;
            }
        $(this).toggleClass('active');
    });

我也尝试过设置 returnValue在全局事件对象上而不是 e按照一篇文章中的建议传递给绑定(bind)函数。

我尝试返回 false:

$('body')
    .on('click', '.toggle', function(e){
        if (e.preventDefault()) {
                e.preventDefault();
            }
        $(this).toggleClass('active');
        return false;
    });

尽管进行了所有这些不同的尝试，IE8 仍在执行链接的默认操作并且没有切换类。我在这里做错了什么？我正在使用 jQuery 1.10.2。

更新:找到了问题的根源。谢谢大家的帮助。我有条件地包含了一些非 IE 脚本元素，这个脚本就是其中之一。返回 false 现在对我有用。非常感谢您将我推向正确的方向!

Answer 1

您的 JS 中除此处以外的其他地方存在错误 - 它正在停止执行，因此您的事件处理程序永远不会被绑定(bind)。

打开开发工具 (F12) 并刷新您的页面，您会看到一个脚本错误。这就是导致问题的原因。

另外，请记住

e.preventDefault();
e.stopPropagation();

与

相同

return false;

stopPropagation() 和绑定(bind)到 body 元素的事件处理程序也有点奇怪，尽管我猜它会阻止事件冒泡到文档...

编辑#2

发生了 3 件事之一 - 1) 您的代码在其他地方出现了一个错误，导致执行停止并且处理程序未被绑定(bind)，2) 您的代码在事件处理程序中出现了错误(不是来自什么你发布了)或 3)你解除绑定(bind)这个事件处理程序(或 body 元素上的所有事件处理程序)特别是在 IE8 中(不太可能)。

开始添加一些 console.log 以查明以上哪一项导致了您的问题。

为了清楚起见，您的事件处理程序应如下所示:

$('body').on('click','.toggle',function(e) {
     e.preventDefault();
     $(this).toggleClass('active');
});