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="enableTextBox" 链接位于同一 div 的 class="comments" 元素，在链接的 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/