Question

嗯，我知道很多时候这个问题或类似问题。但是阅读它们我仍然无法解决问题。

我有以下代码

    $('div#ItemCollection').on('click', function () {

        if ($('div#ListContainer').is(":visible")) {
            $('div#ListContainer').slideUp(400);
        }
        else {
            $('div#ListContainer').slideDown(400)
        }

     //What I have to write here to prevent event propagation
     //in IE8. Cause event.stopPropagation() does not work on IE8.
     //And which is also work on other browsers.
    })

$('body').click(function () {

    if ($('div#ListContainer').is(":visible")) {
        $('div#ListContainer').slideUp(400);
    }
    //Here as well
})

当我点击它时，我使用$('body').click(function () {})事件向上滑动div#ListContainer。由于event.stopPropagation()在Internet Explorer 8中不起作用，div只是打开和关闭。

Answer 1

在事件处理函数中使用事件参数再次尝试，例如

$('body').click(function (event) { ...

如果event.stopPropagation()未定义，则可以使用仅IE属性cancelBubble来阻止事件移动到下一个目标。请注意，cancelBubble已弃用，仅适用于IE8及更早版本：

if(event.stopPropagation)
    event.stopPropagation();
else
    event.cancelBubble=true;

请查看this question和MSDN documentation。

Answer 2

将您的代码更改为：

$('div#ItemCollection').on('click', function (e) { // add e var here
    if ($('div#ListContainer').is(":visible")) {
        $('div#ListContainer').slideUp(400);
    }
    else {
        $('div#ListContainer').slideDown(400)
    }
    e.stopPropagation(); // e is a jQuery object that does magic to work in IE8
})

$('body').click(function () {
    if ($('div#ListContainer').is(":visible")) {
        $('div#ListContainer').slideUp(400);
    }
    // Nothing needed here
})

请注意，如果event.stopPropagation()对象是jQuery对象，event仅适用于IE8。普通的Javascript event.stopPropagation()仅适用于IE9 +。

如何在IE8中停止事件传播

2 个答案: