javascript - ページの任意の場所をクリックすると、Javascriptの要素が非表示になります

Question

「noty_menu」リンクをクリックすると開き、そのリンクをもう一度クリックすると閉じるスライド式のJSメニューがあります。ページのどこかをクリックしたときにメニューが閉じるように設定する方法はありますか？

関連するコードは次のとおりです。

$('.noty_menu').click(function () {
$('ul.the_menu').slideToggle('medium');
});

前もって感謝します！

score 4 · Accepted Answer

あなたは体のクリックをキャッチすることができます：

$('body').click(function() {
    /* close menu */
});

ただし、メニュークリックでは、クリックが本体に伝播しないようにする必要があります。それ以外の場合は、メニューが開き、クリックが上に伝播し、メニューがすぐに閉じます。return false;ここで十分です：

$('.noty_menu').click(function () {
    $('ul.the_menu').slideToggle('medium');
    return false;
});

（のようにハンドラー関数のイベント引数を読み込んでfunction(ev) { ... }呼び出すこともできますev.stopPropagation()）。

メニュー内のクリックでメニューが閉じないようにすることもできます。

$('ul.the_menu').click(function () {
    return false;
});

このソリューションには、伝播を停止する他のクリックイベントもメニューを閉じるのを妨げるという警告があります。

score 2 · Accepted Answer

あなたは使用することができます

$('body').click(function(){
//ur code
});

これをする

score 2 · Accepted Answer

ドキュメント全体を確認できますが、次のような方法でメニューのクリックが含まれます（間隔がある場合は、ユーザーを煩わせる可能性があります）。

var menu=$('ul.the_menu');
$(document).on('click',function(){
    if(menu.height>0) {
        menu.slideToggle('medium');
    }
});

3 に答える 3