Bắt đầu vào giá trị gần nhất từ ​​yếu tố nhấp với jQuery

Question

Tôi có đánh dấu sau:

<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> 

Tôi có một sự kiện click binded vào 'thêm' lớp sử dụng jQuery. Khi tôi nhấp vào đó, tôi muốn nhận được giá trị của tên = "số lượng", nhưng có một số nơi 'thêm' được nhấp và một số trường số lượng.

Tôi đang cố gắng lấy giá trị đầu vào 'gần nhất'. Tôi đã thử sử dụng 'gần nhất' và 'tìm thấy', nhưng không may mắn.

Bất kỳ ý tưởng nào về cách tôi có thể sử dụng jQuery này? Cảm ơn bạn!

Answer 1

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

chiến lược đặt ra ở đây là:

• Sử dụng closest để tìm tổ tiên gần nhất phù hợp với bộ chọn nhất định (trong trường hợp này một div với lớp option)
• Sau đó sử dụng find để tìm input với số name đã cho sử dụng attribute equals selector.
• Cuối cùng, sử dụng val để truy xuất giá trị của input.

Answer 2

Bạn cần sử dụng closest để tìm phần tử kèm theo phù hợp và sau đó làm việc từ đó.

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

Answer 3

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

này nên làm các trick

Answer 4

Tôi đoán công trình gần nhất chỉ với các yếu tố cùng cấp. vì vậy ..

Tại sao không đặt id vào trường nhập và chọn $('#input-id')?

Hoặc đi qua lên đến tùy chọn lớp học và tìm đầu vào trong đó: $(this).parents('.options:first').find('input');