Web ページに「オプション」ボタンがあります。ユーザーがそのボタンをクリックすると、小さなサブメニューが表示されます。
そのメニューの外側をクリックすると、閉じます。ここまでは順調ですね。
私の問題は、(メニューが表示されているときに) オプション ボタンをもう一度クリックすると、メニューが開いたままになることです。閉じる必要があります。
「外部をクリック」機能を管理するコードは次のとおりです。
$j(document).mouseup(function(e) {
var container = $j('.playlist-menu');
if (container.has(e.target).length === 0) {
container.hide();
}
});
そして、ボタンのイベント
$j('#options').click(function() {
$j('.playlist-menu').toggle();
});
HTML 構造:
<button id="options" class="float-left" title="Options" type="button">
<div class="playlist-menu display-none">
<ul>
...
</ul>
</div>
オプション ボタンをもう一度クリックしても閉じない理由がわかりません。そのボタンの e.target が「playlist-menu」ではないのに、メニューが閉じないのはなぜですか??
ありがとう