Wie setze ich Tags in einem benutzerdefinierten JavaScript-Objekt?

Question

Ich bin verwirrt über JavaScript-Objekt Verweisung. wenn ich einen Tag wie folgt:

<button id='myButton'>Hello</button> 

und ich eine benutzerdefinierte Klasse in Javascript zu machen:

function myClass(){ 
    this.myButton= document.getElementById('myButton'); 

    this.myButton.addEventListener("click",function(){ 
     alert(this.myButton.innerHTML); 
    }); 
} 

, was ich erwarte von dieser Funktion ist, wird es zeigt Alarm Popup mit „Hallo“ text , aber was ich habe ist:

TypeError: this.myButton is undefined 

Dann versuche ich tun um die Funktion zu ändern:

function myClass(){ 
    this.myButton= document.getElementById('myButton'); 

    this.myButton.addEventListener("click",function(){ 
     alert(this.myButton); 
    }); 
} 

Und was ich habe ist ein Alarm Popup, das sagt "undefined". Irgendeine Idee, um mein Problem zu lösen?

Answer 1

sollten Sie

function myClass(){ 
    this.myButton= document.getElementById('myButton'); 
    var self = this; 

    this.myButton.addEventListener("click",function(){ 
    alert(self.myButton); 
    }); 
} 

weil this für die Funktion inline verwenden Sie bezieht sich auf window Objekt deklariert.