Llamar una función JavaScript desde un elemento con los datos de su padre

publicado por: Anonymous

Necesito llamar a cierta función de JavaScript cuando haga click en un icono que está dentro de un td, pero los parámetros que quiero pasarle a esa función son los datos del elemento padre del que hice click.

He intentado con esto:

_x000D_

_x000D_

function hola(este) {_x000D_
    document.getElementById("demo").innerHTML = este.id;_x000D_
}

_x000D_

<p>Click the button to trigger a function.</p>_x000D_
<table>_x000D_
    <td id="casita">_x000D_
        <i onclick="parent.hola(this)">@</i>_x000D_
    </td>_x000D_
</table>_x000D_
<p id="demo"></p>

_x000D_

_x000D_

_x000D_

Lo leí en un post de stackoverflow en inglés, pero no me funciona. Lo que estoy intentando es hacer ese innerHTML con la id del td, que sería "casita", pero no logro pasar los datos de ese td mediante el onclick en el icono.

Es muy necesario llamar a la función al hacer click en el icono y no en el td. He intentado con <i onclick="hola(this.parent())">@</i> pero tampoco da resultado.

¿Alguien conoce la manera correcta de hacerlo?

solución

La propiedad que estás buscando es .parentElement.

Se puede usar:

  1. Pasándolo en la función.

    <i onclick="hola(this.parentElement)">
    
  2. Referenciándolo dentro de la función:

    var padre = este.parentElement;
    document.getElementById("demo").innerHTML = padre.id;
    

_x000D_

_x000D_

function hola(este) {_x000D_
    document.getElementById("demo").innerHTML = este.id;_x000D_
}

_x000D_

<p>Click the button to trigger a function.</p>_x000D_
<table>_x000D_
  <td id="casita">_x000D_
    <i onclick="hola(this.parentElement)">@</i>_x000D_
  </td>_x000D_
</table>_x000D_
<p id="demo"></p>

_x000D_

_x000D_

_x000D_

Respondido por: Anonymous

Leave a Reply

Your email address will not be published. Required fields are marked *