onClickOut（要素を離れた後でクリックしてください）

Question

問題は、私が"onClickOut" - イベントが必要だったということでした。

例： ホバーオン（onMouseOver）でDIVを表示しています。

要素の外側をクリックすると非表示にする必要がありますが、 $（ "body"）と言うと、をクリックすると要素自体をクリックすると非表示になります。 ：/

今、私はマウスポジションを聞いています。 mouseleave（）私は自分の要素をクリックするとvarを設定しました。次のステップではgenerelly click-event（body）を聞きますが、varが設定されているかどうかを尋ねます。そうでなければ、要素の外側にあるクリックでなければならないので、要素を隠すことができます。

は、私はあなたがそれを使用することを願って：

$("#schnellsuche_box").mouseleave(function() { 
    var inside; 
    $("#schnellsuche_box").click(function() { 
     inside = true; 
    }); 
    $("body").click(function() { 
     if(!inside) { 
      $("#schnellsuche_box").hide(); 
     } 
    }); 
    delete inside; 
}); 

Answer 1

あなたがクリックされた要素がそうのように、#schnellsuche_boxまたはclosest()を使用して#schnellsuche_box内部の任意の要素だった場合、文書レベルのクリックを聞くことによって、イベントハンドラ内であなたが確認することを実行します。

$(document).on('click', function(e) { 
    if (! $(e.target).closest('#schnellsuche_box').length) 
     $('#schnellsuche_box').hide(); 
}); 

FIDDLE

Answer 2

あなたはbodyクリックイベントまで泡立てるから#schnellsuche_boxクリックイベントを停止する必要があります（つまり、デフォルトイベントの伝播です）return falseを行うことによって：

$("#schnellsuche_box").click(function() { 
    inside = true; 

    return false; 
}); 

Answer 3

試用：

$("body").click(function(e) { 
    var $target = $(e.target); 
    if (!$target.is('#schnellsuche_box') && 
     !$target.parents('#schnellsuche_box').length) { 
     alert('outside'); 
    } 
}); 

Answer 4

$("#schnellsuche_box").on("click",function(event) { 
    event.preventDefault(); 
    event.stopPropagation(); 
});