JavaScript - zdarzenie onclick uzyskiwanie wywoływana automatycznie

Question

pisałem javascript klasy o nazwie „MojaKlasa”, w którym mam zdefiniowaną metodę „closeThis”

MyClass = function(){ 

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

} 

Teraz, w moim html, staram się nazwać w następujący sposób ...

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

Powyższe połączenie zostanie wywołane po kliknięciu przycisku. Problem polega na tym, że zdarzenie "onclick" na górze "clsoeButtion" jest wywoływane automatycznie po załadowaniu strony. Co może być w tym złego?

Answer 1

Wywołujesz funkcję od razu.

Po opuszczeniu nawiasów na odniesienie funkcji, co jesteś w zasadzie mówią to:

ocenić funkcję closeThis i przypisać wynik do onclick

kiedy to, co naprawdę chcesz do jest przypisane odwołanie do funkcji do obsługi kliknięcia:

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

Zamiast tego należy pominąć nawiasy, a powiążesz clo seTa funkcja do onclick. Zamiast tego jest to:

Przypisanie funkcji closeThis do obsługi kliknięcia.

Zasadniczo przypisujesz funkcję do zmiennej jako obiekt pierwszej klasy lub odwołanie do funkcji.

Na marginesie, moim osobistym życzeniem jest zawsze używać anonimowego opakowania funkcji. Czasami trzeba być w stanie przekazać parametry do swojej funkcji, a to sprawia, że ​​się, że można łatwiej to zrobić:

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

Answer 2

Musisz usunąć () z niej inaczej to jest wywoływana natychmiast, ponieważ to jak nazwać funkcja przez dodanie przyrostka (), tak po prostu usunąć te szelki:

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

Answer 3

powinno być document.getElementById("closeButton").onclick = myclassObj.closeThis; nie myclassObj.closeThis();

myclassObj.closeThis() wywoła funkcję, a następnie przypisz wartość do onclick