Làm thế nào để thêm người nghe sự kiện vào một mảng của các đối tượng

Question

Tôi có một mảng các đối tượng (đặc biệt easelJS hình ảnh) - một cái gì đó như thế này:

Những gì tôi muốn làm là có một người biết lắng nghe sự kiện thay vì:

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

tôi muốn các chương trình để biết cụ thể khu vực được nhấp để tôi có thể gửi một hộp cảnh báo theo cách sau:

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

Answer 1

Something như thế này nên làm việc:

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

Lý do nó hoạt động là bởi vì nó tạo ra một kết thúc mà giữ giá trị của index sẽ được hiển thị trong tin nhắn cảnh báo. Mỗi lần thông qua vòng lặp tạo một kết thúc khác giữ một giá trị khác là index.

Answer 2

Chắc chắn. Bạn chỉ có thể sử dụng một đóng cửa để lưu chỉ mục của lần lặp đó. Nếu không thì sẽ được chia sẻ bởi cùng một phạm vi chức năng và sẽ cho bạn giá trị của cùng một lần lặp. Tạo một hàm riêng biệt cho mỗi hàm sẽ lưu trạng thái của hàm đó bên trong hàm.

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

hoặc tốt hơn

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

Answer 3

Chắc chắn, một đóng cửa là giải pháp, nhưng vì anh ấy có Ext nạp ông cũng có thể sử dụng nó và nhận được một số mã rất dễ đọc. Chỉ mục được chuyển làm đối số thứ hai cho số Ext.Array.each (được đặt tên là Ext.each).

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

Answer 4

Đây là những gì tôi đang sử dụng cho div id của:

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!