jQueryの使われていないJavaScriptで、あるクラスの要素をクリックした際何らかの処理を行おうとしています。
動的に要素が追加されるためページ全体のクリックイベントを拾い、クラス「.box」を持っているか判断するようにしてみたのですが。要素そのものをクリックしたときはうまくいきますが、要素内の文字など、内部に含まれる何かをクリックしたときには何も起きません。
子要素のどれをクリックしても処理を行うようにするにはどのようにすればいいのでしょうか?
html
1<div id="wrapper"> 2 <div class="box"> 3 <span>text</span> 4 </div> 5</div> 6 7<style type="text/css"> 8.box { 9 background: #DDD; 10} 11 12.box span { 13 background: #AAA; 14} 15</style>
javascript
1// .box がクリックされたを判断する 2document.getElementById('wrapper').addEventListener("click", function(e){ 3 var elem = e.target; 4 if(elem.classList.contains("box")){ 5 alert('box clicked'); 6 } 7});
回答2件
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。
2018/10/12 03:19
2018/10/12 06:57