jQuery div click post hide 在 IE8 中无法正常工作

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 -> request_info 显示。点击UniqueID_2 -> request_info 显示。再次点击UniqueID_1 -> 没有任何反应。

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

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

Answer 1

试试下面的代码：

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