jQuery在同一個容器中查找類名的元素

Question

我有一個MVC中的UserControl，它可能會在頁面上重複多次。

說我有這樣的事情如下：

<div> 
    <a href="#" class="enableTextBox">edit</a>" 
    <input type="text" class="comments" readonly="readonly" /> 
</div> 

<div> 
    <a href="#" class="enableTextBox">edit</a>" 
    <input type="text" class="comments" readonly="readonly" /> 
</div> 

<div> 
    <a href="#" class="enableTextBox">edit</a>" 
    <input type="text" class="comments" readonly="readonly" /> 
</div> 

我怎樣才能找到class="comments"元件，其在同一div爲class="enableTextBox"鏈接，在鏈接的onclick事件？

這是處理元素ID衝突的明智方式嗎？有沒有更好的辦法？在企業應用程序中運行並確保數據一致性的安全性如何？

Answer 1

使用jQuery的.siblings()方法是單向的：

$('.enableTextBox').click(function() { 
    var $comments = $(this).siblings('.comments'); 
    return false; // Prevent page refresh 
}); 

• http://api.jquery.com/siblings/

有很多的遍歷方法可在jQuery的：

• http://api.jquery.com/category/traversing/

編輯：添加return false;以防止鏈接刷新頁面。

這裏有一個例子可以測試：http://jsfiddle.net/MZEmP/

Answer 2

$(".enableTextBox").click(function() { 
    $(".comments", $(this).parent()) //this will get you the comments associated with the anchor you click on 
})