Obtener valor de entrada más cercano de elemento se hace clic con jQuery

Question

tengo el siguiente marcado:

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

tengo un evento de clic binded a la clase de 'añadir' usando jQuery. Cuando hago clic en eso, me gustaría obtener el valor de name = "cantidad", pero hay varios lugares donde se hace clic en 'agregar' y varios campos de cantidad.

Estoy tratando de obtener el valor de entrada 'más cercano'. Intenté usar 'más cercano' y 'findall', pero no tuve suerte.

¿Alguna idea de cómo puedo obtener esto usando jQuery? ¡Gracias!

Answer 1

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

La estrategia aquí es:

• Uso closest para encontrar el ancestro más cercano que coincida con el selector dado (en este caso un div con la clase option)
• A continuación, utilice find para encontrar el input con el dado name usando el attribute equals selector.
• Finalmente, use val para recuperar el valor de input.

Answer 2

Debe usar closest para encontrar el elemento de encerramiento apropiado y luego trabajar desde allí.

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

Answer 3

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

Esto debería hacer el truco

Answer 4

supongo obras más cercanos única con elementos del mismo nivel. así que ...

¿Por qué no poner el id en el campo de entrada y seleccionar por $('#input-id')?

O recorrer hasta las opciones de clase y encontrar la entrada en ese país: $(this).parents('.options:first').find('input');