我是Javascript的新手,我正试图在Javascript中的for循环中调用另一个函数内的函数。我在JS循环中阅读了有关闭包和范围的所有答案,但仍无法使其工作。基本上我要做的是将事件监听器附加到数组的每个元素。
这是我的代码:
HTML:
<div class="todo-item">
To Do item #1
<button class="btn btn-success btn_task" data-name="data1">Done</button>
</div>
<div class="todo-item">
To Do item #2
<button class="btn btn-success btn_task" data-name="data2">Done</button>
</div>
<div class="todo-item">
To Do item #3
<button class="btn btn-success btn_task" data-name="data3">Done</button>
</div>
通过AJAX更新HTML的JS函数:
function showTodo(str, label) {
var xmlhttp = new XMLHttpRequest();
xmlhttp.onreadystatechange = function() {
if (this.readyState == 4 && this.status == 200) {
document.getElementById("todo").innerHTML = this.responseText;
}
};
xmlhttp.open("GET", "../datasource.php?lang=" + label + "&data=" + str, true);
xmlhttp.send();
}
不起作用的部分:
var todoElements = document.getElementsByClassName("btn_task");
for (var i = 0; i < todoElements.length; i++) {
(function(index) {
todoElements[index].addEventListener("click", function(){
var attribute = todoElements[index].getAttribute('data-name');
showTodo(attribute, "Spanish");
})
})(i);
}
答案 0 :(得分:1)
没有理由在这里使用here。要绑定到所有按钮,只需要一个简单的this
循环。
在事件处理程序中,您可以使用var todoElements = document.getElementsByClassName("btn_task");
for (var i = 0; i < todoElements.length; i++) {
todoElements[i].addEventListener('click', function(){
showTodo(this.getAttribute('data-name'), "Spanish");
});
}
来获取您单击的元素。
Sub Example1()
Dim sht As Worksheet
Dim fndList As Variant
Dim rplcList As Variant
Dim x As Long
fndList = Array("hi", "United States", "Mexico")
rplcList = Array("hello", "USA", "MEX")
'Loop through each item in Array lists
For x = LBound(fndList) To UBound(fndList)
'Loop through each worksheet in ActiveWorkbook
For Each sht In ActiveWorkbook.Worksheets
sht.Cells.Replace What:=fndList(x), Replacement:=rplcList(x), _
LookAt:=xlPart, SearchOrder:=xlByRows, MatchCase:=False, _
SearchFormat:=False, ReplaceFormat:=False
Next sht
Next x
End Sub
答案 1 :(得分:0)
试试这个(ES6):
function getAttr(e){
const name = this.dataset.name;
showTodo(name, "Spanish");
}
const buttons = document.querySelectorAll('.btn_task');
buttons.forEach(button => button.addEventListener('click', getAttr));
我们在这里做的是获取所有按钮,为每个按钮分配一个名为getAttr的点击处理程序。 getAttr传递了单击的按钮元素,它查看数据集(具有&#34;数据的所有元素 - &#39;)并选择data-name属性。它将此传递给您的函数。