添加动态命名的事件侦听器。
添加动态命名的事件侦听器。
提问于 2014-05-22 09:58:57
我正在尝试创建一个可配置的按钮栏，并在每个按钮中添加onclick事件侦听器。我需要动态分配函数，并使用按钮的data-function属性提供的名称。
…
<div class="button-set">
<span class="function-button" data-function="func1"></span>
<span class="function-button" data-function="func2"></span>
</div>
…剧本：
window.onload = function (){
var btns = document.getElementsByClassName("function-button");
for (var i=0; i < btns.length; i++) {
var b = btns[i];
b.addEventListener("click", ?????, false);
}
}
function func1() { … }
function func2() { … }那么，在?????中应该做什么，以便将正确的函数添加到每个按钮的onclick事件中？
我想要这个没有jQuery。
回答 1
Stack Overflow用户
回答已采纳
发布于 2014-05-22 10:03:39
假设func1和func2是全局函数，
b.addEventListener("click", window[b.getAttributte('data-function')], false);
// Or, in new browsers:
b.addEventListener("click", window[b.dataset.function], false);如果它们不是全球性的，您应该这样声明：
var functions = {
func1: function () { … },
func2: function () { … }
}
b.addEventListener("click", functions[b.dataset.function], false);您可以使用邪恶的eval代替，但最好避免它(较慢和注入易受攻击)：
b.addEventListener("click", eval(b.dataset.function), false);页面原文内容由Stack Overflow提供。腾讯云小微IT领域专用引擎提供翻译支持
原文链接：
https://stackoverflow.com/questions/23814093
复制相关文章
相似问题
腾讯云开发者
