私はいくつかのHTMLメニューを持っており、ユーザーがこれらのメニューの頭をクリックすると完全に表示されます。ユーザーがメニューの外側をクリックすると、これらの要素を隠したいと思います。
このようなことはjQueryで可能でしょうか?
$("#menuscontainer").clickOutsideThisElement(function() {
// Hide the menus
});
ウィンドウを閉じるためのクリックイベントをドキュメントボディに取り付けます。ドキュメントボディへの伝搬を止めるために、コンテナに別のクリックイベントを付けます。
$(window).click(function() {
//Hide the menus if visible
});
$('#menucontainer').click(function(event){
event.stopPropagation();
});
Eranさんの例と同じような動作をするアプリケーションがありますが、メニューを開くときにクリックイベントをボディにアタッチしています...。このような感じです。
$('#menucontainer').click(function(event) {
$('html').one('click',function() {
// Hide the menus
});
event.stopPropagation();
});
jQuery の one()
関数]1の詳細はこちら