OnClick Assignment循環中的閉包

我試圖讓循環遍歷一個「Page」對象數組的navBar。不幸的是，我似乎陷入了循環/閉合陷阱。我已經閱讀了幾個與此相關的線程，並在某些情況下有複製和粘貼的解決方案代碼，並通過我自己的變量，但我努力使其正確分配onclicks。OnClick Assignment循環中的閉包

我知道我很近。在下面的代碼中是我嘗試過的兩個選項。

我在自我調用函數中的括號中的參數有問題嗎？ - （）（divId）？我不太瞭解這部分。

難道我也在掙扎，因爲這是作爲一種對象方法來完成的嗎？

任何幫助非常感謝，但容易對我，我在業餘時間學習這一切！ ;）

在此先感謝。

編輯：的jsfiddle：https://jsfiddle.net/mcgettrm/fs0mtz6n/

var navBar = { 
display: function(){ 
    for(i=0;i<pages.length;i++){ 
     document.getElementById('navBar').innerHTML += pages[i].token; 
     var divId = pages[i].unique; 

// code works fine up to here. 
// option one(below): when navBar.display() is called the following code only adds 
// the onclick to the final navbar link 

     document.getElementById(divId).onclick=(function(divId) { 
       return function() { 
       alert(divId); 
      }; 
     })(divId); 

//option two(below): when navBar.display() is called the following code logs 
// the individual div id's correctly. But, it does it without being clicked. Then, 
// only the last item in the loop is clickable. 

     (function(divId){ 
       document.getElementById(divId).onclick= function(){ 
        console.log(divId); 
       } 
      } 
     )(divId); 
    } 
}

};

來源

2017-01-30 Michael McGettrick

有趣的問題，我已經嘗試了IIFE的各種變化，每次只有最後一個元素被賦予onclick處理程序。 – abhishekkannojia

非常感謝你的評論 - 我花了幾個小時在這方面做了工作。只是知道這不僅僅是我自己真的很有幫助。有時候，當你覆蓋新的領域時，很難知道你是否只是在愚蠢！ –

我知道了在這裏工作 - https://jsfiddle.net/pqu9kr85/它似乎並沒有一直與i更多，你需要先建立導航HTML的結合做，確保它在DOM綁定之前事件。我把兩個獨立的循環，一個生成導航，第二個綁定事件。同時更新page.display()以使用this，因爲這將受到i的值的影響。

來源

2017-01-30 14:40:36 theleebriggs

OnClick Assignment循環中的閉包

回答

相關問題