Javascript: come fare in modo che un controllo si invii in un metodo

Question

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

Dove potrebbe avere SomeMethod:

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

Invece di:

function SomeMethod(itemId)
{
  var someItem;

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

}

Esempio sciocco, ma l'idea non è quella di inviare l'id stesso, ma il controllo effettivo che chiama il metodo. Giuro che questo può essere fatto ma non ho avuto fortuna a cercare ... parzialmente perché non sono nemmeno sicuro su cosa cercare.

Ho pensato che fosse il sé, ma il sé non sembra essere quello che voglio quando lo script che ho eseguito.

Answer 1

Utilizza la parola chiave this .

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

Answer 2

In realtà non devi passare questo come argomento alla tua funzione, perché hai un oggetto evento click a cui puoi accedere. Quindi:

<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

Tendo a utilizzare questo approccio in tutte le chiamate di funzione dagli attributi HTML: -

onclick="SomeMethod.call(this)"

Quindi nel javascript fai: -

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

Questo ha un netto vantaggio quando puoi anche assegnare direttamente alle proprietà del gestore eventi nel codice Javascript: -

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

Se SomeMethod prendesse l'elemento di contesto come parametro, sarebbe molto imbarazzante impostare: -

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

Peggio ancora, sarebbe una perdita di memoria.

Answer 4

A questo punto: SomeMethod (this) - this restituisce l'oggetto finestra quindi non usarlo. Il modo giusto di usare this è renderlo rilevante per il contesto, quindi usa SomeMethod.call (this) .