Seleccione el primer hermano

Question

Estoy tratando de seleccionar el valor interno de la primera hermano - usando jQuery -. En un entorno donde no puedo alterar el formato HTML

Tengo el siguiente:

<tr>
    <td>3</td>
    <td>bob</td>
    <td>smith</td>
    <td>bob@example.com</td>
    <td>
        <img src="bobsmith.png" onclick="doSomething()" />
    </td>
</tr>

Estoy tratando de obtener el valor de la primera <td> con lo siguiente:

function doSomething() {
    var temp = $(this).parent().parent().children().filter(':first');
    alert("you clicked person #" + temp.html());
}

Todo lo que consigo de esto es null.

He intentado varias combinaciones con la función .siblings() también, pero fue en vano.

¿Alguna idea?

Gracias,

Nota: Se me olvidó mencionar que la tabla del extracto es de se carga y refrescado al de una llamada AJAX de forma dinámica. Esto puede ser pertinente para sugerencias que incluyen une.

Solución: He ido con la siguiente solución, inspirada en la respuesta aceptada:

<tr>
    <td>3</td>
    <td>bob</td>
    <td>smith</td>
    <td>bob@example.com</td>
    <td>
        <img src="bobsmith.png" onclick="doSomething(this)" />
    </td>
</tr>

y para el javascript jQuery:

function startStopNode(el) {
    var temp = $(el).parent().siblings(':first').html();
    alert("you clicked: " + temp);
}

Answer 1

$( 'td:first-child', $( this ).parents ( 'tr' ) ).html ();

Esto seleccionará el primer elemento TD (: filtro de primer hijo) en el TR matriz de la imagen. parents() devuelve todos los padres del elemento, y filtrar los padres para que se devuelven sólo los elementos TR.

Además, trate de escribir su imagen, así:

<img src="bobsmith.png" onclick="doSomething(this)" />

y su función, así:

function doSomething ( imgEl ) {
}

y el uso imgEl en lugar de this

Answer 2

$('tr td:last-child img').click(function(){

    alert($('td:first-child',$(this).closest('tr')).text());

});

Answer 3

Me configurar un evento usando jQuery, pero eso es totalmente de usted.

$("table td:last img").click(function() {
    var firstTd = $(this).parents("tr").find("td:first").html();
    alert("you clicked person #" + firstTd);
}); 

No importa qué, todavía se puede utilizar este ejemplo con su propio código:

function doSomething()
{
    var firstTd = $(this).parents("tr").find("td:first-child").html();
    alert("you clicked person #" + firstTd);
}

---

Tienes razón. 'Esto' no se está pasando, es necesario editar el código HTML para hacer que el trabajo. O simplemente utilizar jQuery en lugar como demostración arriba.

Answer 4

Tal vez esto ayude a alguien. Esto es sólo una parte de todo el artículo aquí .

La diferencia

Si desea utilizar este para acceder al elemento HTML que está manejando el caso, debe asegurarse de que la palabra clave this se escribe realmente en la propiedad onclick. Sólo en ese caso tampoco se refiere al elemento HTML al controlador de eventos se ha registrado a. Así que si lo hace

element.onclick = doSomething;
alert(element.onclick)

se obtiene

function doSomething()
{
    this.style.color = '#cc0000';
}

Como se puede ver, la palabra clave this está presente en el método onclick. Por lo tanto, se refiere al elemento HTML.

Pero si lo hace

<element onclick="doSomething()">
alert(element.onclick)

se obtiene

function onclick()
{
    doSomething()
}

Esto es meramente una referencia a la función doSomething (). La palabra clave this no está presente en el método onclick por lo que no se refiere al elemento HTML.

Answer 5

Tenemos una fila de la tabla, donde una columna es la acción, otras columnas contienen datos. Una de las columnas contiene el código del producto (UPC). Por eso, utilizamos esta opción para visualizar el código de producto cada vez que alguien hace clic en un botón de acción:

var product_code = jQuery(obj).parents('tr').children('.upc').text();
alert('product code'+product_code);

Esto funciona porque nuestras células de la tabla tienen clases, como 1919191911919 para cada fila.

Puede utilizar otros selectores de jQuery, sin embargo. Tal como .children ( '# myid') si tiene atributos ID situado en la celda 19191919199191, así como cualquier número de los otros selectores como .children (td: en primer lugar). Para obtener la primera celda de la misma fila