どこでも検索しましたが、この質問に対する答えが見つかりませんでした。
div 内にいくつかの div を含むメニューを作成しました。
<nav id="menu">
<span>Open Menu</span>
<div class="dropdownContain">
<div class="dropOut">
...
...
<div id="logout_wrap">
<a id="logout">
そして、「#menu」をクリックするとメニューが表示(トグル)され、本体をクリックするとメニューが消えるようにJQueryを使ったスクリプト。この機能のために、stopPropagation() メソッドを使用して #dropDownContain が「本体」の hide() 関数を実行するのを停止する必要がありました
$(document).ready(function () {
$('#menu').click(function (e) {
e.stopPropagation();
$('.dropdownContain').toggle();
});
$(document).click(function (e) {
$('.dropdownContain').hide();
});
$('.dropdownContain').click(function (e) {
e.stopPropagation();
});
また、「#dropdownContain」(メニューの本体) 内にある「#logout」のクリック イベントを作成して、someThing() 関数を実行しました。
jQuery('body').on('click', '#logout', function () {
alert("THIS DOES NOT WORK");
});
問題は、親で呼び出される stopPropagation() メソッドが原因で、 "#logout" に割り当てられた関数が起動しないことです (またはそう思います)。
このコードの html + js へのリンクは次の とおりです。
メニューポップアップを説明どおりに機能させたまま、これを修正する解決策はありますか?