javascript - JQueryでクリックされた行のテーブルセルを取得する方法

Question

HTMLのテーブルがあり、その行のonclickイベントがあります。

セルごとに個別のハンドラーを設定しなくても、行のどのセルがクリックされたかを確認できるかどうか疑問に思いました。

私はテーブルを持っています：

<tr class="new_row">
   <td class="date">date</td>
   <td class="name">name</td>
   <td class="delete">delete</td>
</tr>

およびjquery：

$(".new_row").click(function(){
   if(delete was clicked){
       delete the row
   }
});

それが私が基本的にやりたいことです。削除セルがクリックされたかどうかを検出します。

これは可能ですか？

score 5 · Accepted Answer

まず、同じIDで複数の要素を定義しないでください。問題が発生します。で置き換えることができid='delete'ますclass='delete'。

// on click td with class delete:
$("td.delete").click(function(){
   //delete was clicked so remove tr
   $(this).parent().remove();
});

score 3 · Accepted Answer

あなたはこのようにそれを行うことができます

$(".new_row").click(function(event){       
    if($(event.target).text() == 'delete')
    {       
      $(this).remove();      
    }
});

score 1 · Accepted Answer

のIDを見てくださいevent.target。に一致する場合deleteは、削除を処理できます。

ただし、これはテーブルにあるので、複数の行があると思います。この場合、同じIDを持つ複数のセルがあることを意味しますか？その場合、これは有効なHTMLではなく、CSSセレクターを使用しようとするとjQueryコードで問題が発生する可能性があります。

3 に答える 3