1

この問題は、ここで見つけた他の多くの問題と似ていますが、うまくいく適切な答えが見つかりません。

すべてのコンテンツは .ajax() メソッドを使用してロードされ、イベントは .on() を使用して処理されます。最初に.stopPropagation()を使用して関数の伝播を停止しようとしましたが、それはある意味で動作します.divを閉じますが、その後、要素を閉じる関数を使用して押し続けます.検索して見つけました.off() メソッドを使用する必要がある Web 上。

コードは次のとおりです（短くしました）：

$("#pnNotaCom").on("click",function(){
   $(".cautareProdNouNC").css({"display":"block"});
    $("html").on("click",function(){
        $(".cautareProdNouNC").css("display","none");
    });
});

$(".cautareProdNouNC").click(function(e){
    e.stopPropagation();
});

$("#pnNotaCom").click(function(e){
    e.stopPropagation();
});

私が表示/非表示にしているdivは.cautareProdNouNC

4

4 に答える 4

2

これは私がそれを行う方法です。div をアクティブにすると、全身を満たす目に見えない div がアクティブになります。その div をクリックすると、両方が非表示になります。

HTML

<div class="cautareProdNouNC display_none"></div>
<div class="overlay display_none"></div><!--place it in body-->

CSS

.cautareProdNouNC {
    position relative; /*this div needs to be above overlay so needs z-index*/
    z-index: 200;
}
.display_none {
    display: none;
}
.overlay {
    background: transparent;
    position: fixed;
    top: 0;
    left: 0;
    width: 100%;
    height: 100%;
    z-index: 100;
}

jquery

$("#pnNotaCom").on("click",function(){
$(".cautareProdNouNC").removeClass('display_none');
$(".overlay").removeClass('display_none');
});

$(".overlay").on("click",function(){
$(this).addClass('display_none');
$(".cautareProdNouNC").addClass('display_none');
}
于 2013-09-20T13:39:36.930 に答える
1 
$(document).delegate('click', function(){
    if($('#Div2Hide').get(0) != $(this).get(0)){ 
        $('#Div2Hide').hide();
        e.stopPropagation();
    }
});
于 2013-09-20T12:39:05.957 に答える
1

これを試して

$(document).mouseup(function (e) {
var container = $(your hiding div selector here);

if (!container.is(e.target) // if the target of the click isn't the container...
&&
container.has(e.target).length === 0) // ... nor a descendant of the container
{
    container.hide();
}
});
于 2013-09-20T12:41:09.583 に答える