[解決済み] 子要素のクリックイベントが親要素のクリックイベントを誘発する
2023-06-29 07:44:01
質問
このようなコードがあるとします。
<html>
<head>
</head>
<body>
<div id="parentDiv" onclick="alert('parentDiv');">
<div id="childDiv" onclick="alert('childDiv');">
</div>
</div>
</body>
</html>
を発動させたくないので
parentDiv
をクリックしたときに
childDiv
をクリックしたときにクリックイベントを発生させたいのですが、どうすればよいのでしょうか?
更新
また、この2つのイベントの実行順序はどのようになりますか?
どのように解決するのですか?
$('#childDiv').click(function(event){
event.stopPropagation();
alert(event.target.id);
});
説明 イベントが DOM ツリー上にバブリングするのを防ぎます。 親ハンドラがイベントの通知を受けることを防ぎます。
関連
-
[解決済み] 要素外でのクリックを検出するにはどうすればよいですか?
-
[解決済み] event.preventDefault() vs. return false
-
[解決済み] Node.jsを使うタイミングをどう判断するか?
-
[解決済み] テキストボックスのEnterキーで、JavaScriptでボタンクリックをトリガーする
-
[解決済み] JavaScript で DOM ノードのすべての子要素を削除する
-
[解決済み] React jsのonClickはメソッドに値を渡すことができない
-
[解決済み] 子アンカーがクリックされたときに、親のonclickイベントが発生しないようにするにはどうすればよいですか?
-
[解決済み] divが可視化されたときにアクションを起こすjQueryイベント
-
[解決済み】JavaScriptでウィンドウのリサイズイベントをトリガーする方法は?
-
[解決済み] JavaScriptでの大文字小文字を区別しない正規表現
最新
-
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 実装 サイバーパンク風ボタン
おすすめ
-
[解決済み] イベントバブリング、キャプチャーとは何ですか?
-
[解決済み] JavaScriptで次の要素/前の要素を取得しますか?
-
[解決済み] なぜ "use strict "はパフォーマンスを10倍向上させるのか?
-
[解決済み] node.jsで文字列のsha1ハッシュを取得するにはどうすればよいですか?
-
[解決済み] Javascript / jQueryでAndroid端末を検出する。
-
[解決済み] jQueryの$という記号の意味は何ですか?
-
[解決済み] javascriptで文字列から関数を作成する方法はありますか?
-
[解決済み] javascriptでオプションのパラメータを扱う
-
[解決済み] HTML要素にスクロールバーがあるかどうかをチェックする
-
[解決済み] JavaScriptでDIVを表示・非表示にするには?