javascript的onclick事件的'this'的範圍

Question

我試圖訪問一個函數使用this爲一個javascript onclick事件。目前我只能使用this返回dom節點。是否有可能擴大這個dom節點以外的範圍？我想調用函數toggleLayer。使用Dojo 1.7+

toggleLayer: function(){ 
    console.log('toggled layer!!!'); 
}, 

_init: function() { 
    this.domNode.innerHTML = 'Click <a href="#"onclick="this.toggleLayer()">Here</a> to toggle layer'; 
} 

編輯 - 這是我從Quentins答案想出瞭解決辦法：

toggleLayer: function() { 
    console.log('toggled layer!!!'); 
}, 

_init: function() { 
    this.domNode.innerHTML = ''; // Erase existing content 
    this.domNode.appendChild(document.createTextNode('Click ')); 
    var link = document.createElement('a'); 
    link.appendChild(document.createTextNode('Here')); 
    link.href = "#"; 
    link.addEventListener('click', this.toggleLayer.bind(this)); 
    this.domNode.appendChild(link); 
    this.domNode.appendChild(document.createTextNode(' to toggle layer')); 

} 

Answer 1

不在此例。您通過創建一個字符串然後轉換它來生成DOM。你從字符串中所做的功能與你所在的範圍沒有任何關係。

改爲使用正確的DOM。

this.domNode.innerHTML = ""; // Erase existing content 
this.domNode.appendChild(document.createTextNode("Click ")); 
var button = document.createElement("button"); // Don't use links to the top fo the page for this 
button.appendChild(document.createTextNode("Here")); 
button.addEventListener("click", this.toggleLayer.bind(this)); 
this.domNode.appendChild(button); 
this.domNode.appendChild(document.createTextNode(" to toggle layer")); 

Answer 2

結合的上下文給功能的「道場方式」是通過使用lang.hitch：

掛鉤（）返回在給定上下文中執行的給定功能的功能。

https://dojotoolkit.org/reference-guide/1.10/dojo/_base/lang.html#hitch

這裏就是它的純道場做：

require([ 
    'dojo/_base/lang', 
    'dojo/dom', 
    'dojo/dom-construct', 
    'dojo/on' 
], function(
    lang, 
    dom, 
    domConstruct, 
    on 
) { 

    function onClick() { 
     console.log('Got clicked context: ', this) 
    } 

    var link = domConstruct.create('a', { 
     textContent: 'Click me!', 
     href: '#' 
    }, dom.byId('my-div')); 

    on(link, 'click', lang.hitch(this, onClick)); 

});