Question

我有一个使用javascript在页面上创建的div元素列表，其格式为：

<div id="UniqueID" class="request">
    <div class="request_main"></div> //VISIBLE
    <div class="request_info"></div> //HIDDEN
</div>

点击div后，jQuery点击监听器会处理request_main元素上的点击事件，并在父div处搜索request_info div。然后它会显示request_info div，如果它尚未显示。

$(".request_main").live('click', function() {       
    $(".nrl").removeClass('blue').addClass('grey');                 
    if ($(this).parent().find(".request_info").css('display') == 'none') {
        $(".request_info").hide();  
        $(this).parent().find(".request_info").stop(false,true).show("slide", {direction:"up"}, 300, function(){});
        $(this).find(".nrl").removeClass('grey').addClass('blue');
        $(".links").removeClass('white').addClass('grey');
        $(".links").css('background-color','white');
        $(this).find(".links").removeClass('grey').addClass('white');
        $(this).find(".links").css('background-color','#1B75BB');
    }           
});

在Firefox，Safari，Chrome甚至IE9中都可以正常使用。但是，在IE8中，该功能仅适用于之前未点击过的div。点击UniqueID_1 - ＆gt;显示request_info。点击UniqueID_2 - ＆gt;显示request_info。再次点击UniqueID_1 - ＆gt;没有任何反应。

alert($(this).parent().find(".request_info").css('display'));

此语句在每次点击时使用正常工作的浏览器返回none和block。在IE8中，第一次返回none和block，之后返回undefined（点击同一个div时）。即使我在显示和隐藏调用后将函数中的div的值显式设置为none和block，也会发生这种情况。

Answer 1

尝试使用以下代码：

$(".request_main").live('click', function(e) {
  e.stopPropagation();
});

jQuery div点击后隐藏在IE8中无法正常工作

1 个答案: