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。

我的尝试返回false：

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

尽管有这些不同的尝试，但IE8正在采用链接的默认操作而不会切换类。我在这做错了什么？我正在使用jQuery 1.10.2。

更新：找到问题的根源。谢谢大家的帮助。我有条件地为非IE包含了一些脚本元素，这个脚本就是其中之一。回归虚假现在正在为我做伎俩。非常感谢让我朝着正确的方向前进！

Answer 1

你的JS除了这里之外还有一个错误 - 它停止了执行，因此你的事件处理程序永远不会受到限制。

打开开发工具（F12）并刷新页面，您将看到脚本错误。这就是造成这个问题的原因。

另外，请记住

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

与

相同

return false;

stopPropagation（）和一个绑定到body元素的事件处理程序也有点奇怪，虽然我猜它会阻止事件冒泡到文档......

编辑＃2

有三件事情中的一件发生了 - 1）你的代码中有一个错误会停止执行并且处理程序没有被绑定，2）你的代码中的事件处理程序中有一个错误（不是来自什么你发布了）或者3）你在IE8中特意解开了这个事件处理程序（或者body元素上的所有事件处理程序）（不太可能）。

开始添加一些console.log来弄清楚上面哪一个导致你的问题。

要完全清楚，您的事件处理程序应如下所示：

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

Answer 2

在IE8 event对象中没有preventDefault方法。在你的代码中调用它会在控制台中给你这样的错误：

TypeError: Object #<MouseEvent> has no method 'preventDefault'

此错误导致脚本立即停止，以便锚可以执行其主要作业，该作业跟随href。而不是使用：

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

简单的jQuery click事件绑定在IE8中不起作用

2 个答案: