3

使用時に子ではなく、現在クリックされているdivのみをクリーンに選択することは可能.on("click",ですか？

基本的に、フェードインすると幅が100％、高さが100％の外側のdivがあり、中央にコンテナがあります。外側のdivをクリックすると両方がフェードアウトしますが、クリックするとフェードアウトしないようにすることを目的としています。内側のdiv。

この問題を示すために、ここでjFiddleを作成しました：http：//jsfiddle.net/silver89/kaxsL/

使ってみましdiv > #boxたが運が悪かったので、もっと提案を探していませんか？

4

5 に答える 5

4

これを試して：

$(document).on("click", "a", function(){
     $("#box").fadeIn("fast");
     return false;
});

$('div#box').on('click',function(e){
    $(this).fadeOut();
});

$('div.inner').on('click',function(e){
   e.stopPropagation();
});

イベントがバブリングするのを止める必要があるだけです。どちらのdivを選択しても、何でもできます。</p>

于 2012-06-26T19:59:17.907 に答える
3

を確認できますtarget。targetあなたの場合は、#box電話することができますfadeOut

$(document).on("click", "div > #box", function(e) {
    if (e.target.id === "box") {
        $("#box").fadeOut("fast");
    }
});​

更新されたフィドル

于 2012-06-26T19:55:17.127 に答える
1

JsFiddle のデモ

$(document).on("click", "#box", function(){
      $("#box").fadeOut("fast");
});

$(document).on("click", "#box .inner", function(e){
   e.stopPropagation();
});​
于 2012-06-26T20:03:13.677 に答える
0

内側の div を外側の div から独立させ (たとえば、子ではなく)、CSS を使用して「内側」のボックスを必要な場所に配置することを検討しましたか?

于 2012-06-26T19:56:30.277 に答える
0

はevent.target、イベントを受け取った要素です。そうでない場合thisは、子孫からバブリングしています。

$(document).on("click", "div > #box", function(ev){
    if( this == ev.target )
        $("#box").fadeOut("fast");
});

JSFiddle

于 2012-06-26T20:00:39.077 に答える