Mootools正在为循环设置事件

Mootools setting up Event on for loop

本文关键字：设置 事件 循环 Mootools      更新时间：2023-09-26

我有一个关于Mootools事件处理的问题。。。

在这种情况下，你有一个循环，每个循环都创建一个div并在其上附加一个事件。它总是取循环的最后一个循环的值。

类似：

for(var i=0;i<10;i++) {
 var el = new Element('div').inject($(document.root));
 el.addEvent('click',function() {
  alert(i); 
 });
}

所有元素将发出警报"10"。我想要的是让每个新元素计数+1。第一个=0，第二个=1。。。

希望有人能理解我的意思。提前Thx！

在添加到局部变量时使用闭包来封装迭代器：

for(var i=0;i<10;i++) {
    var el = new Element('div').inject($(document.root));
    (function(i){    
        el.addEvent('click',function() {
            alert(i); 
        });
    }(i));
}

学派认为不应该在循环中创建函数。

您可以做的其他事情是将迭代器传递给构造函数并将其保存在存储器中：

var el = new Element('div').store('index', i).inject(document.body);
...
click: function(){
    console.log(this.retrieve('index'));        
}

您还可以使用.each，它会自动为您执行迭代器：

var a = new Array(10);
a.forEach(function(item, index){
    new Element('div', {
        events: {
            click: function(){
                alert(index);
            }
        }
    }).inject(document.body);
});

你也可以将它绑定到回调。。。许多许多模式。

找到了一个变通方法，不确定它是否符合您的要求。

检查小提琴这里

JS/Mootools:

for(var i=0;i<10;i++) {
 var el = new Element('div', {onclick: 'alert('+i+')',text:i}).inject(document.body);
}
相关文章：