2012-04-11 21 views
12

ho scritto una classe javascript denominata "MyClass", in cui ho definito un metodo "closeThis"JavaScript - onclick evento sempre chiamato automaticamente

MyClass = function(){ 

this.closeThis = function(){ 
     document.getElementById("hidePane").style.display = 'none'; 
} 

} 

Ora, nel mio html, sto cercando di chiamare quel come segue ...

<script type="text/javascript"> 
    function callThis(){ 
     var myclassObj = new MyClass(); 
     document.getElementById("closeButton").onclick = myclassObj.closeThis(); 
    } 
</script> 

Chiamata sopraQuesto verrà chiamato quando ho fatto clic su un pulsante. Il problema qui è che l'evento "onclick" in cima a "clsoeButtion" viene richiamato automaticamente al caricamento della pagina. Cosa potrebbe esserci di sbagliato in questo?

+2

Rimuovere la parestesi dopo ... onclick = myclassObj.closeThis(). –

risposta

15

Stai chiamando la funzione immediatamente.

quando si lascia la parentesi sul riferimento alla funzione, quello che stai dicendo è fondamentalmente:

valutare la funzione closeThis e assegnare il risultato a onclick

quando ciò che si vuole veramente fare è assegnare la funzione di riferimento al gestore di clic:

document.getElementById("closeButton").onclick = myclassObj.closeThis; 

lasciare fuori le parentesi, invece, e lo legherò il clo questa funzione per l'onclick. Ciò che invece dice è:

Assegnare la funzione closeThis al gestore di clic.

Si sta essenzialmente assegnando la funzione alla variabile come oggetto di prima classe o come riferimento a una funzione.

Per inciso, la mia preferenza personale è di utilizzare sempre un wrapper di funzione anonimo. A volte è necessario essere in grado di passare parametri nella vostra funzione, e questo fa in modo che è più facile fare così:

document.getElementById("closeButton").onclick = 
    function() { 
     myclassObj.closeThis(); 
    }; 
+2

Grazie @ jmort253 Ha funzionato come un incantesimo ... Il primo approccio che hai suggerito è come assegnare il risultato all'evento onclick che è strano. Il secondo approccio è interessante. Come hai detto, ora posso ancora passare i parametri. Grazie molto :-) – Sriram

2

è necessario rimuovere () da esso altrimenti viene chiamato subito perché è così che si chiama un funzione dal suffisso (), così semplicemente rimuovere questi sostegni:

document.getElementById("closeButton").onclick = myclassObj.closeThis; 
5

dovrebbe essere document.getElementById("closeButton").onclick = myclassObj.closeThis; non myclassObj.closeThis();

myclassObj.closeThis() chiamerà la funzione, quindi assegnerà il valore a onclick