Jquery變量沒有得到正確的值，除非我有警報

Question

這讓我瘋狂，我不知道是什麼導致了這個問題。我有兩個數組，其中一個列出pageID，另一個列出頁面。

當我嘗試使用下面的代碼時，'頁面'總是發回'前面'。如果在我聲明變量「var newObject」之前在for循環中發出警報，則輸出正確，頁面顯示「front，insideLeft，insideRight和back」。

所有其他屬性都輸出正確。

請在下面找到我的代碼：

var pageID = ["cardFront","cardInsideL","cardInsideR","cardBack"]; 
    var pages = ["front","insideLeft","insideRight","back"]; 

    for (var i=0; i<pageID.length; i++) { 
     var cfTextarea = $('#' + pageID[i] + ' textarea'); //array of textareas 

     //Get each textarea properties and encode to json 
     $("#" + pageID[i] + " textarea").each(function(){ 

     var txtOffset = $(this).offset(); 
     var divOffset = $("#" + pageID[i]).offset(); 

     var newObject = { 
      'page'  : pages[i], 
      'id'  : $(this).attr('id'), 
      'src'  : $(this).attr('src'), 
      'width'  : $(this).width(), 
      'height' : $(this).height(), 
      'top'  : txtOffset.top - divOffset.top, 
      'left'  : txtOffset.left - divOffset.left, 
      'rotation' : '0', 
      'colour' : $(this).css("color"), 
      'size'  : $(this).css("font-size"), 
      'bold'  : $(this).css("font-weight"), 
      'underline' : $(this).css("text-decoration"), 
      'align'  : $(this).css("text-align"), 
      'font'  : $(this).css("font-family"), 
      'text'  : $(this).val() 
     }; 
     data.textareas.push(newObject); 
     }); 
    } 

Answer 1

的問題是，你傳遞給each功能將只得到i=0。

您可以變通的作法是這樣做（未經測試，但是這是標準的做法）：

function mk_add_text_area(data, page_id, page) { 
    return function(elem) { 
     var txtOffset = $(elem).offset(); 
     var divOffset = $("#" + page_id).offset(); 

     var newObject = { 
      'page'  : page, 
      'id'  : $(elem).attr('id'), 
      'src'  : $(elem).attr('src'), 
      'width'  : $(elem).width(), 
      'height' : $(elem).height(), 
      'top'  : txtOffset.top - divOffset.top, 
      'left'  : txtOffset.left - divOffset.left, 
      'rotation' : '0', 
      'colour' : $(elem).css("color"), 
      'size'  : $(elem).css("font-size"), 
      'bold'  : $(elem).css("font-weight"), 
      'underline' : $(elem).css("text-decoration"), 
      'align'  : $(elem).css("text-align"), 
      'font'  : $(elem).css("font-family"), 
      'text'  : $(elem).val() 
     }; 
     data.textareas.push(newObject); 
    } 
} 

再後來就......

//Get each textarea properties and encode to json 
    $("#" + pageID[i] + " textarea").each(mk_add_text_area(data, pageID[i], pages[i]));