javascript - ウィンドウ外のクリックを検出する方法

Question

「ul」と「li」でコード化されたhtmlでカスタマイズされたドロップダウンがあり、ユーザーが「ul」の頭をクリックするとオプションが表示されます。ユーザーがメニュー領域の外をクリックすると、これらの要素を非表示にしたいと思います。

Jqueryではなくjavascript/YUIでこのようなことは可能ですか?

Answer 1

私は YUI 派ではないので、これはもう少しうまく書けると思いますが、テストしたところうまくいきました。

ドキュメントがクリックされるたびにドロップダウンを非表示にします。

Y.one(document).on("click", function(){
    Y.one("#menu").hide(); 
});

のクリックが にul伝播するのを防ぎますdocument:

Y.one("#menu").on("click", function(e){
    e.stopPropagation();    
});

訪問者がどこかをクリックすると、クリックが にバブルアップしdocument、メニューが非表示になります。メニューをクリックすると、イベントが にバブリングされdocumentなくなり、メニューが非表示になりません。

デモ: http://jsfiddle.net/nHnZT/

Answer 2

use('event-outside')「外部」イベントのサポートを追加します。詳細については、ユーザー ガイドを参照してください: http://yuilibrary.com/yui/docs/event/outside.html