Javascript: Cómo hacer que un control se envíe en un método.

Question

<a href="" id="someId" onclick="SomeMethod(self);"></a>

Donde SomeMethod podría tener:

function SomeMethod(item)
{
  item.setAttribute('name', item.id);
}

En lugar de:

function SomeMethod(itemId)
{
  var someItem;

  someItem = document.getElementById(itemId);
  someItem .setAttribute('name', someItem .id);

}

Ejemplo tonto, pero la idea es no enviar el ID en sí, sino el control real que llama al método. Juro que se puede hacer esto, pero no he tenido la suerte de buscar ... en parte porque no estoy seguro de en qué buscar.

Pensé que era yo mismo, pero el yo no parece ser lo que quiero cuando se ejecuta el script que tengo.

Answer 1

Utilice el esta palabra clave.

<a href="" id="someId" onclick="SomeMethod(this);"></a>

Answer 2

En realidad, no es necesario que pase esto como un argumento a su función, porque tiene un objeto de evento de clic al que puede acceder. Entonces:

<a href="" id="someId" onclick="clickEventHandler()"></a>
<script>
function clickEventHandler(event) {

    if (!event) {
        event = window.event; // Older versions of IE use 
                              // a global reference 
                              // and not an argument.
    };

    var el = (event.target || event.srcElement); // DOM uses 'target';
                                                 // older versions of 
                                                 // IE use 'srcElement'
    el.setAttribute('name', el.id);

}
</script>

Answer 3

Tiendo a usar este enfoque en todas las llamadas a funciones desde atributos HTML: -

onclick="SomeMethod.call(this)"

Luego, en el javascript, haz: -

function SomeMethod()
{
   this.setAttribute('name', this.id);
}

Esto tiene una clara ventaja cuando también puede asignar directamente a las propiedades del controlador de eventos en el código Javascript: -

document.getElementById("someID").onclick = SomeMethod

Si SomeMethod tomara el elemento de contexto como un parámetro, sería muy difícil de configurar: -

function(id) {
   var elem = document.getElementById(id)
   elem.onclick = function() { SomeMethod(elem); }
}("someID");

Peor aún, esto sería el cierre de pérdida de memoria.

Answer 4

En este punto: SomeMethod (this) - this devuelve el objeto de la ventana, así que no lo use. La forma correcta de usar esta palabra clave es hacerla relevante al contexto, así que use SomeMethod.call (this) .