Как добавить обработчики событий в массив объектов

у меня есть массив объектов (в частности easelJS изображений) - что-то вроде этого:Как добавить обработчики событий в массив объектов

То, что я хочу сделать, это есть событие слушателя вместо:

gShape.addEventListener("click", function() {alert"stuff"});

Я хочу, чтобы программа специально знать, какой регион щелкнул, так что я могу отправить окно предупреждения следующим образом:

imageArray[index].addEventListener("click", function(){ 
    alert " you clicked region number " + index}

источник

2013-07-31 Ryan Williams

Как вы хотите отличаться от того, что у вас есть? –

Это должно сработать .. Вы пробовали? – putvande

@Jeffman Похоже, что он находится в цикле, где 'index' не будет правильным в обратном вызове – Ian

Что-то, как это должно работать:

for (var i = 0 ; i < imageArray.length ; ++i) { 
    function(index) { 
     imageArray[index].addEventListener("click", function() { 
      alert ("You clicked region number: " + index"); 
     }); 
    } (i); 
}

Причина это работает, потому что это создает замыкание, которое содержит значение index, которое будет отображаться в предупреждающем сообщении. Каждый раз через петлю создается другое закрытие, удержание другого значения index.

источник

2013-07-31 21:44:18

Кто-нибудь знает, почему я был downvoted? Просто интересуюсь. –

Кто-то, вероятно, не проверял метку времени и думал, что вы скопировали вышеупомянутый ответ. –

Несомненно. Вы можете просто использовать закрытие, чтобы сохранить индекс этой итерации. В противном случае они разделяются одной и той же функциональной областью и дадут вам значение той же итерации. Создание отдельной функции для каждого из них сохранит состояние внутри функции.

var imageArray = new Array; 
gShape = new createjs.Shape(); 
// shape is something 
imageArray.push(gShape); // Dumped all the objects 

for(var i=0; i< immageArray.length; i++) { 
    (function(index) { 
     imageArray[index].addEventListener("click", function() { 
      console.log("you clicked region number " + index); 
     }) 
    })(i); 
}

или лучше

for(var i=0; i< immageArray.length; i++) { 
     imageArray[i].addEventListener("click", bindClick(i)); 
} 

function bindClick(i) { 
    return function(){ 
      console.log("you clicked region number " + i); 
      }; 
}

источник

2013-07-31 21:45:18

Вы можете делать что угодно, но я бы просто удалил первый пример. Это не только то, что другие ответы есть, я не думаю, что это действительно должно когда-либо использоваться, когда вы можете использовать что-то более чистое и более эффективное, как ваш второй пример. – Ian

@ Я .. Я согласен с тобой .. Но могут быть случаи когда пользователь может не понять, как он работает, если не будет подробного примера. Именно по этой причине я оставил первый пример, чтобы они могли сравнить, как 1-й пример может быть написан более чистым способом. –

Спасибо @ Sushanth- - В конце концов я заканчиваю эти ситуации «подъема лямбды» и, как правило, может работать лучше, но хорошо видеть два бок о бок. – phatskat

Конечно, закрывающий это решение, но так как у него есть Ext загружен, он мог бы также использовать его и получить очень читаемый код. Индекс передается как второй аргумент Ext.Array.each (с псевдонимом Ext.each).

Ext.each(imageArray, function(gShape, index) { 
    gShape.addEventListener("click", function() { 
     alert("You clicked region number " + index); 
    }); 
});

источник

2013-08-01 00:56:59 rixo

Это то, что я использую для div идентификаторов:

var array = ['all', 'what', 'you', 'want']; 

function fName() { 
    for (var i = 0; i < array.length; i++) 
    document.getElementById(array[i]).addEventListener('click', eventFunction); 
};

Good Luck!

источник

2016-06-27 01:09:43

Как добавить обработчики событий в массив объектов

ответ

Смежные вопросы