Jquery Loop無法正常工作？

Question

我想創建一個循環來創建許多功能，以便當用戶單擊拇指向上按鈕時，它運行正確的.php文檔。它很好用，當我刪除循環，只給我一個特定的數字，但只要我嘗試使它成爲一個循環，在警報（我）我得到10在第一個循環。

var i=1; 
while (++i < 10) { 
    $('#thumbup' + i).click(function() { 
     var userid = $('#theuser' + i).text(); 
     var url = "_thumbup.php?userid=" + userid; 
     //alert(url); 

     $('#thumbup' + i).hide(); 
     $('#thumbdown' + i).hide(); 

     $("#toggle").css("display","block"); 
     alert(i); // Give me 10 on first loop?!? 

     // get the URL 
     http = new XMLHttpRequest(); 
     http.open("GET", url, true); 
     http.send(null); 

     // prevent form from submitting 
     return false; 

    }); 
    } 

Answer 1

這是一個經典問題：當你的回調被調用時，i具有循環結束的值。

這裏是你如何解決這個問題：

var i=1; 
while (++i < 10) { 
    (function(i){ 
     // your current code 
    })(i); 
} 

它的工作原理，因爲內部函數創建一個當它被稱爲範圍，而這個範圍包含了你想要的i值。

Answer 2

您必須將i的值傳遞給您的回調。 試試這個：

var i=1; 
while (++i < 10) { 
    (function(i){ 
     $('#thumbup' + i).click(function() { 
     var userid = $('#theuser' + i).text(); 
     var url = "_thumbup.php?userid=" + userid; 
     //alert(url); 

     $('#thumbup' + i).hide(); 
     $('#thumbdown' + i).hide(); 

     $("#toggle").css("display","block"); 
     alert(i); // Give me 10 on first loop?!? 

     // get the URL 
     http = new XMLHttpRequest(); 
     http.open("GET", url, true); 
     http.send(null); 

     // prevent form from submitting 
     return false; 

     }); 
    })(i); 
    }