2015-12-17 4 views
0

Я пытаюсь получить доступ к функции, используя this для javascript onclick. В настоящее время я могу только вернуть узел dom, используя this. Возможно ли расширить область вне этого dom-узла? Я хотел бы назвать функцию toggleLayer. Использование додзё 1.7+область действия 'this' для события onclick javascript

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

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

EDIT - Вот решение, которое я придумал из 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')); 

} 
+1

Это возможно, но не 'onclick' атрибута. Используйте [addEventListener] (https://developer.mozilla.org/en-US/docs/Web/API/EventTarget/addEventListener) вместо этого, в сочетании с 'bind' – hindmost

ответ

3

Не в этом случае. Вы создаете 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")); 
+0

Это отлично работает. Я смог преобразовать этот пример, чтобы использовать ссылку вместо кнопки. – ians

0

«Dojo путь» связывание контекста к функции с помощью lang.hitch:

устройства() возвращает функцию, которая будет выполнять данную функцию в данном контексте.

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

Вот как это делается с чистым Dojo:

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)); 

}); 
+0

спасибо, не зря, посмотрим на это, если я решаю пойти на чистый Додзё! – ians

Смежные вопросы