jquery - jqueryのonblurイベントでコンテキストメニューを非表示にする

Question

blurイベントでコンテキストメニューをうまく非表示にしようとした人はいますか? 私がやりたいことは、マウスがコンテキストメニュー内に配置されていないときに、カスタマイズされた右クリックメニューを非表示にすることですdiv。

これは、jquery コンテキストメニュープラグインを使用します。

score 1 · Accepted Answer

フォーカスがコンテナーの領域を離れるタイミングを知りたいが、コンテナー内の子コントロールがイベントをトリガーしないようにする場合は、を使用しますmouseleave。

$('#menu').on('mouseleave', function(){
  $(this).hide();
});

mouseoutまたはblur、このシナリオでは必要ありません。コンテナー内の子コントロールがマウスフォーカスを受け取るとトリガーされ、それらを含むメニューが非表示になるためです。

score 0 · Accepted Answer

コールバックでぼかしを使用します。ただし、テストされていません。他のぼかしの右クリック機能を復元しますか? これは、他の種類のイベントでより適切に実行されると思います。

$("input").blur(function () {
     window.oncontextmenu = function () {
        return false;
     }
});

score -1 · Accepted Answer

あなたはイベントについて明示的に言及していますが、あなたが言及したコンテキストメニューはおそらく焦点が合ったりぼやけたりすることはないblurので、それが実際に必要なものではないと思います。div

mouseoutイベントを使用する必要があります。

コンテキストメニューのIDが「contextMenuContainer」であるとすると、これでカバーされます。

$('#contextMenuContainer').mouseout(function() {
    $(this).hide();
});

詳細については、jQueryイベント/マウスアウトのドキュメントを参照してください。

アップデート：

リンク先のプラグインページにmouseoutイベントハンドラーを登録してみましたが、問題なく起動していました。ただし、メニュー項目を変更するたびに発生することに注意してください。そのため、イベントターゲットをチェックして、マウスが実際にメニュー全体を終了したことを確認する必要があります。

3 に答える 3