2010-09-02 17 views
16

tengo el siguiente código HTML:¿Cómo encuentro elemento más próximo con jQuery

<td> 
    <input type="text" size="40" value="" name="related_image" id="related_image"> 
    <input type="button" class="button addImage" value="Get image url"> 
</td> 
<td> 
    <input type="text" size="40" value="" name="alternative_image" id="alternative_image"> 
    <input type="button" class="button addImage" value="Get image url"> 
</td> 

necesito averiguar qué botón que haga clic, a continuación, añadir un poco de texto al campo de texto de entrada más cercano.
P. ej. si hago clic en el botón en el primer <td>, entonces necesito ingresar texto en el campo de texto related_image.

He tratado con el followin jQuery, pero no está funcionando: (. Estoy simplemente recuperar el nombre de entradas para las pruebas)

jQuery('.addImage').click(function() { 
    var tmp = jQuery(this).closest("input[type=text]").attr('name'); 
    alert(tmp); 
}); 

Creo que podría tener que usar find y/o siblings. Pero no estoy muy seguro de cómo.

Cualquier ayuda apreciada.

EDITAR

simplemente me las arreglé para utilizar el código
addImageEvent = jQuery(this).prevAll("input[type=text]:first")

Es usar prevAll una mala elección?

Respuesta

26

Probar:

var tmp = $(this).siblings(":text").attr("name"); 

TheEl métodoque está utilizando encuentra el ancestro más cercano, que no es lo que desea aquí.

+1

aaaah - de alguna manera pensé que hermanos = niños. Pero hermanos = hermano/hermana. Gracias. Veo que hay múltiples soluciones para este "problema". – Steven

+1

si existen muchos hermanos, ¿cómo encontrar el más cercano? – Sudarshan

+0

funciona como un encanto, gracias :) intenté "siguiente" y "más cercano" antes de hermanos! :RE – rikpg

5

.closest() encuentra uno de los padres, en este caso es necesario .siblings(), así:

jQuery('.addImage').click(function() { 
    var tmp = jQuery(this).siblings("input[type=text]").attr('name'); 
    alert(tmp); 
}); 

O si el formato es siempre consistente como tu ejemplo, sólo tiene que utilizar .prev(), así:

jQuery('.addImage').click(function() { 
    var tmp = jQuery(this).prev().attr('name'); 
    alert(tmp); 
}); 
+0

Sip. Como comenté anteriormente, mezclé padre/hijo, pensando en hermanos = hijos. Thansk para la solución :) – Steven

3

Aquí es una aplicación 'más cercano' que tiene como objetivo descendientes en lugar de los padres:

$.fn.nearest = function(selector) { 
    var nearest, node = this, distance = 10000; 
    node.find(selector).each(function(){ 
     var n = $(this), 
      d = n.parentsUntil(node).size(); 
     if (d < distance) { 
      distance = d; 
      nearest = n; 
     } else if (d == distance) { 
      nearest.add(this); 
     } 
    }); 
    return nearest; 
}; 
Cuestiones relacionadas