不显眼的 Javascript-Basic 实现:如何将特定类的所有元素绑定到 Javascript 中的函数?

Unobtrusive Javascript-Basic Implementation: How do I bind all elements of a particular class to a function in Javascript?

提问人:Brandon S. 提问时间:4/6/2016 最后编辑:CommunityBrandon S. 更新时间:4/6/2016 访问量:49

问:

所以我之前读过这个 SO 问题,我目前正在尝试让 Unobtrusive javascript 的基本实现正常工作,但我不知道我在哪里挣扎。通常,这是我会挣扎很长时间的事情,直到我自己弄清楚,但我开始陷入时间紧迫......

我的 HTML 文档中有几个元素,带有一个名为“RMButton”的类,我正在尝试使我使用此类的所有元素调用一个名为“RemoveQBox”的函数(为了清楚起见。QBox 是一个 DIV 元素,“RMButton”类的对象是从文档中删除 div 的小按钮。RemoveQBox 已经写好了,当我使用内联 JS 调用它时可以正常工作(例如:REMOVE),但由于某种原因,我在 JS 中的绑定并没有真正发挥作用。有人知道我在这里错过了什么吗?

我的 Javascript 文件顶部

var DBSetFields = [];
var NumQBoxes = 1;

window.onload = function() {
    RMNodeList = document.getElementsByClassName("RMButton");
    for (var i = 0; i < RMNodeList.length; ++i) {
        console.log(RMNodeList[i]);
        RMNodeList[i].onclick = RemoveQBox;

    }
};

顶级域名:如何在 Javascript 中将特定类的所有元素绑定到函数?

编辑:

    function RemoveQBox(e){
    console.log("Remove");
    var RemoveButton = this; //this == e.currentTarget
    console.log(RemoveButton);
    var QBox = RemoveButton.parentNode;
    QBox.remove();
    NumQBoxes -= 1;
}
javascript html 不显眼的 javascript

评论

0赞 Hacketo 4/6/2016
控制台中有任何错误吗?代码看起来不错,我会在这里添加:varvar RMNodeList = document..
0赞 Brandon S. 4/6/2016
不幸的是,控制台中没有任何内容......RemoveQBox 中还有一个控制台.log语句,让我知道该函数是否被调用......事实并非如此。 编辑:另外,添加了......没有区别。var
0赞 Hacketo 4/6/2016
这只是一个范围问题,它使变量成为函数的局部变量,而不是全局变量,与问题无关。var
0赞 Hacketo 4/6/2016
这意味着未调用 main 函数,或返回空列表getElementsByClassName("RMButton")
0赞 Brandon S. 4/6/2016
对不起,我删除的评论有误。我犯了一个错误。window.onload 实际上正在被调用。

答: 暂无答案