jQuery在行中找到id为id的元素

pob*_*ska 3 jquery

我有一个简单的表,我正在尝试使用jQuery将单元格.name和.date中的文本值发送到表单中.这个脚本工作得很好,但是我不知道如何仅在这一行中查找带有类的文本,例如.name,用户在Book-button上查询.

我的表结构:

      <table id="myTable"> 
<thead> 
<tr> 
    <th>Name</th> 
    <th>Date</th> 
    <th>Place</th> 
    <th>Price</th> 
    <th>Hours</th> 
    <th>Book</th> 
</tr> 
</thead> 
<tbody> 
      <tr> 
    <td class="name"><a href="#" title="title1">Camp1</a></td>  //send to form this value
    <td class="date">10.09 - 15.09.2014 r.</td>   //send to form this value
    <td>Brighton</td> 
    <td>555 EURO</td> 
    <td>20</td> 
    <td class="book"><button>Book<button></td>   //when user click on this button
</tr> 

          <tr> 
    <td class="name"><a href="#" title="title1">Camp2</a></td> 
    <td class="date">02.09 - 22.09.2014 r.</td> 
    <td>Brighton</td> 
    <td>432 EURO</td> 
    <td>20</td> 
    <td class="book"><button>Book<button></td> 
</tr>     
<tr> 
    <td class="name"><a href="#" title="title1">Camp3</a></td> 
    <td class="date">23.09 - 27.09.2014 r.</td> 
    <td>Brighton</td> 
    <td>123 EURO</td> 
    <td>20</td> 
    <td class="book"><button>Book<button></td> 
</tr> 
</tbody></table>

          </tbody> 
</table> 
Run Code Online (Sandbox Code Playgroud)

我的剧本:

<script>
$( "button" ).click(function() {
var text = $( '.name' ).text();
$( "#name" ).val( text );
var text = $( '.date' ).text();
$( "#date" ).val( text );
});
</script>
Run Code Online (Sandbox Code Playgroud)

我的表格:

<fieldset id="contact_form" style="display:none;">
<div id="result"></div>
    <label for="name"><span>Name</span>
    <input type="text" name="name" id="name" placeholder="Enter Your Name" />
    </label>

    <label for="email"><span>Email Address</span>
    <input type="email" name="email" id="email" placeholder="Enter Your Email" />
    </label>

        <label><span>&nbsp;</span>
        <button class="submit_btn" id="submit_btn">Submit</button>
        </label>
    </fieldset>
        <button c

lass="submit_btn" id="submit_btn">Submit</button>
    </label>
</fieldset>
Run Code Online (Sandbox Code Playgroud)

Bla*_*ger 11

http://api.jquery.com/category/traversing/tree-traversal/

$( "button" ).click(function() {
    var text = $(this).closest('tr').find('.name').text();
    $( "#name" ).val( text );
    text = $(this).closest('tr').find('.date').text();
    $( "#date" ).val( text );
});
Run Code Online (Sandbox Code Playgroud)

更好的是,<form>使用<input type="hidden">包含该数据的元素围绕每个按钮,即使没有启用JavaScript也可以使用它.