Q&A
できました！先に投稿していただいたIzui様をベストアンサーにさせていただきます。
Oka様もご回答ありがとうございました。
$("#list").find("tr").click(function(){ });
元々上記のようなイベント設定を記述していましたが、諸事情によりon関数のイベントに変更しなければならなくなりました。
「#list」までのセレクタであれば下記のような記述で対応できるのですが、
その配下の「tr」要素にイベントを適用したい場合、どのような記述にすればよいのでしょうか？
(最悪trタグに特定のclassを設定すればできますが・・)
$(document).on('click', '#list', function(){
回答4件
0
諸事情により
下記の２つは動きが異なります。
javascript
1$("#list").find("tr").click(function(){}); 2$(document).on('click', '#list tr', function(){});
（table じゃなくて ul にしてますが）下記で Item1 と Item2 でクリックしたときのアラートが異なります。
後者は後から追加した要素のイベントも拾うのに対して、前者では拾いません。
html
1<!DOCTYPE html> 2<html> 3<head> 4 <meta charset="UTF-8"> 5 <title></title> 6</head> 7<body> 8 <ul id="list"> 9 <li>Item1</li> 10 </ul> 11 <script src="//code.jquery.com/jquery-2.1.4.min.js"></script> 12 <script type="text/javascript"> 13 $(function(){ 14 $("#list").find("li").click(function(){ 15 alert(1); 16 }); 17 $(document).on('click', '#list li', function(){ 18 alert(2); 19 }); 20 $("#list").append($('<li>').text("Item2")); 21 }) 22 </script> 23</body> 24</html>
ご理解されているからこそ on に変えることになったのだと思いますが、念のため。
投稿2015/08/07 02:36
総合スコア4514
0
ベストアンサー
javascript
1$(document).on('click', '#list tr', function(){});
このような形で記述できると思います。
投稿2015/08/07 02:22
総合スコア1698
0
スペース区切りで、下記のように指定すれば動くと思います。
$(document).on('click', '#list tr', function(){
投稿2015/08/07 02:24
総合スコア12
0
javascript
1$('#list tr').on('click', function(){ 2});
今更ですがdocumentに対してのクリックを全部拾って判定してしまうので、こっちが良いと思います。
但し、あとから動的に追加したtrのイベントを拾いたい場合はdocumentで良いと思います。
投稿2015/08/07 03:43
総合スコア559
あなたの回答
tips
プレビュー
バッドをするには、ログインかつ
こちらの条件を満たす必要があります。