Mootools настройка события на цикл

Question

У меня есть проблема относительно 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. Frist = 0, second = 1, ...

Надеюсь, что кто-то поймет, что я имею в виду. Thx заранее!

Answer 1

использовать замыкание инкапсулировать итератор в момент добавления в локальную переменную:

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

вы могли бы связать его с обратным вызовом также ... многие многие шаблоны.

Answer 2

Обнаружено обходное решение, не уверенное, соответствует ли оно тому, что вы хотите.

Проверить скрипку here

JS/Mootools:

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