javascript迴圈事件只響應最後一次的問題處理

流火行者發表於2015-04-10

  在所有的物件導向程式語言中,只要涉及到邏輯的程式碼,常見的問題都是迴圈建立很多個物件UI,在迴圈體中對這些物件新增事件。如果不做處理,和其他地方一樣的新增事件,其結果都是隻響應最後一次迴圈之後的結果。原因就是這些事件雖然在迴圈體中建立,但是迴圈會在瞬間完成,事件還要等到觸發才能執行,所以執行的時候,所有變數就都是最後一次迴圈產生的變數。

  每種語言對此的處理方式幾乎都是要在迴圈的時候給事件繫結上當前建立的物件,只是語言規範上稍有初入。最近使用js做幾個頁面,所以留下js的處理方式。

我在js中迴圈建立了很多div,每個div中都有一個input按鈕。這個input按鈕點選時候觸發其對應的所有div的標題資訊。迴圈或者類中的程式碼如下:

 

1         (function(obj,title){
2             obj.onclick=function(){
3                 alert(title);
4             }
5         })(input,this.title);

將input物件傳入繫結到事件,才可以在每次事件觸發的時候不會找到最後一次迴圈的物件

 

相關文章