テーブル内でのjQueryのクリックイベントの処理

Question

それぞれに1つのボタンと1つのテキストボックスを含む複数の行を含むテーブルがあります。

テキストボックス値でアラートをトリガする最も簡単な方法は何ですか？

Answer 1

あなたは、そのは<tr>を含むへのDOMを横断ボタンにクリックハンドラをバインドして、そこからテキストボックス見つけることができます：テキスト入力やボタンは2つだけであれば

// Bind a click handler to all buttons in the table... 
$('table :button').click(function() { 

    var text = $(this) // "this" is the button which was clicked 
    .closest('tr')  // find the <tr> which contains it... 
    .find(':text')  // find the text box within that <tr>... 
    .val();    // and get its value 

    alert(text); 
}); 

Answer 2

をボタンはフォーム要素がある

$('#table_id').delegate('a', function() { 
    alert($(this).closest('tr').find('input[type="text"]').val()); 
}); 

場合、あなたは'input[type="button"]'で'a'セレクタを置き換えることができます。行（<tr>）に、あなたは、このようなイベントハンドラを使用することができます。