[解決済み] [Solved] クリックイベントを子ではなく親のDIVにのみ発生させるには?
2022-04-03 10:27:44
質問
DIVにclassed
foobar
そして、そのDIVの中にあるいくつかのDIVはクラス化されていませんが、それらは
foobar
というクラスがあります。
$('.foobar').on('click', function() { /*...do stuff...*/ });
DIVのどこかをクリックしたときだけ発動し、その子DIVには発動しないようにしたいのですが。
どのように解決するのですか?
もし
e.target
と同じ要素です。
this
をクリックした場合、子孫をクリックしたことにはなりません。
$('.foobar').on('click', function(e) {
if (e.target !== this)
return;
alert( 'clicked the foobar' );
});
.foobar {
padding: 20px; background: yellow;
}
span {
background: blue; color: white; padding: 8px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<div class='foobar'> .foobar (alert)
<span>child (no alert)</span>
</div>
関連
-
[解決済み】jQuery.addClassが動作しない。
-
[解決済み] jquery fadeIn が動作しない。
-
[解決済み] jQueryでPUT/DELETEリクエストを送信する方法は?
-
[解決済み] jQuery が Ajax 呼び出しの終了を待って戻るようにするにはどうすればよいですか?
-
[解決済み] jQueryでdiv内のspanにテキストを追加する
-
[解決済み] セレクトした要素の外側のHTMLを取得する
-
[解決済み] jQuery に何かを実行する前にすべての画像の読み込みを待つように指示する公式な方法
-
[解決済み] jQuery $(document).ready と UpdatePanels?
-
[解決済み] ユーザーがIEを使用しているかどうかを確認する
-
[解決済み] [Solved] 'blur'イベントが発生したとき、フォーカスがどの要素に*行ったかを調べるにはどうすればよいですか?
最新
-
nginxです。[emerg] 0.0.0.0:80 への bind() に失敗しました (98: アドレスは既に使用中です)
-
htmlページでギリシャ文字を使うには
-
ピュアhtml+cssでの要素読み込み効果
-
純粋なhtml + cssで五輪を実現するサンプルコード
-
ナビゲーションバー・ドロップダウンメニューのHTML+CSSサンプルコード
-
タイピング効果を実現するピュアhtml+css
-
htmlの選択ボックスのプレースホルダー作成に関する質問
-
html css3 伸縮しない 画像表示効果
-
トップナビゲーションバーメニュー作成用HTML+CSS
-
html+css 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] TypeError: $.ajax(...) is not a function?
-
[解決済み] jQueryでPUT/DELETEリクエストを送信する方法は?
-
[解決済み] jQuery が Ajax 呼び出しの終了を待って戻るようにするにはどうすればよいですか?
-
[解決済み] How to make the first option of <select> selected with jQuery
-
[解決済み] 無効な JSON プリミティブ ERROR
-
[解決済み] jQueryで文字色を変更するにはどうすればよいですか?
-
[解決済み] jQueryのif文でのOR演算子の使用について
-
[解決済み] チェックボックスのオン/オフの切り替え
-
[解決済み] jQueryの各ループから抜け出すには?
-
[解決済み] フォーム送信のjQueryが動作しない