使用jQuery从clicked元素获取最接近的输入值

时间:2011-12-28 19:20:31

标签: javascript jquery

我有以下标记:

<div class="options">
  <div class="quantity">
     <label>Qty:</label>
     <input type="text" name="quantity" value="1"/>
  </div>
  <div class="buttons">
    <a href="#" class="add">Add Item</a>
  </div>
</div>

我使用jQuery将一个点击事件绑定到'add'类。当我点击它时,我想得到name =“quantity”的值,但是有几个地方点击了'add'和几个数量字段。

我正在尝试获得“最接近”的输入值。我尝试过使用'最近'和'findall',但没有运气。

知道如何使用jQuery获取此功能吗?谢谢!

4 个答案:

答案 0 :(得分:32)

$(".add").on("click", function () {
    var val = $(this).closest("div.options").find("input[name='quantity']").val();
});

这里的策略是:

  • 使用closest查找与给定选择器匹配的最近祖先(在这种情况下,div与类option匹配<)
  • 然后使用find使用attribute equals selector查找给定input的{​​{1}}。
  • 最后,使用val检索name
  • 的值

答案 1 :(得分:5)

您需要使用closest找到合适的封闭元素,然后从那里开始工作。

$(link).closest(".options").find("input[name=quantity]")

答案 2 :(得分:0)

$(this).parent().parent().find("input[name=quantity]").val()

这应该可以解决问题

答案 3 :(得分:0)

我猜最近的作品只适用于相同级别的元素。所以..

为什么不将id添加到输入字段并按$('#input-id')选择?

或者遍历课程选项并在那里找到输入:$(this).parents('.options:first').find('input');