迭代器爲什麼總是等於4，我該如何解決這個問題？

Question

我想從我的數據庫加載評論和他們的答覆。

爲此，我需要知道在哪些評論之後需要添加哪些回覆。

我試着用迭代器做這件事，把我作爲一個id分配給每個新評論，然後嘗試將所有相應的回覆添加到相關的"#"+i可悲的是，這不起作用，你可以在console.logs的輸出中看到：

ITERATOR: 1 
ITERATOR: 2 
ITERATOR: 3 
ITERATOR: 4 

ANSWER ITERATOR: 4 
ANSWER ITERATOR: 4 
ANSWER ITERATOR: 4 
ANSWER ITERATOR: 4 

所有答覆都在評論添加有沒有什麼明顯預計4

ID。

這是什麼原因造成的？我該如何解決？

（我添加使用insertAfter($("#"+i));的答覆）由@wostex指出

---

var i = 0; 
    var postKey = "<%= post.key %>"; 
    var commentsRef = firebase.database().ref("comments/"+postKey).orderByChild('commenttimestamp').limitToFirst(25); 
    commentsRef.once("value", function(snapshot) { 
     snapshot.forEach(function(childSnapshot){ 
      i++; 
      console.log("ITERATOR: "+i); 

       $("#commentsBox").prepend("<div class='fullComment' id='"+i+"'><a href='../../users/"+childSnapshot.val().author+"'><div class='userCommentBox'><div class='commentUsername'>"+childSnapshot.val().username+"</div><img class='userPic' src='https://storage.googleapis.com/gaminghub-upload/"+childSnapshot.val().profilepic+"' /></div></a><div class='comment'>"+childSnapshot.val().text+"</div><div><img data-post='"+postKey+"' data-comment='"+childSnapshot.key+"' data-author='"+ childSnapshot.val().author +"' class='commentCross' src='./../../public/assets/cross.png'><img class='replyIcon' data-comment='"+childSnapshot.key+"' data-author='"+ childSnapshot.val().author +"' src='./../../public/assets/replyIcon.png'></div></div>"); 
       var that = $(this); 
       var answersRef = firebase.database().ref("comments/"+postKey+"/"+childSnapshot.key+"/answers"); 
       answersRef.orderByChild("answertimestamp").once("value", function(answersSnapshot) { 
        answersSnapshot.forEach(function(answer) { 
         if (answer.val().profilepic == undefined || answer.val().profilepic == null || answer.val().profilepic == "") { 
          $("<div class='answer'><a href='../../users/"+answer.val().author+"'><div class='userCommentBox'><div class='commentUsername'>"+answer.val().username+"</div><img class='userPic' src='../../../public/assets/miniProfilePic.png' /></div></a><div class='comment'>"+answer.val().text+"</div><div><img class='answerCross' data-post='"+postKey+"' data-comment='"+childSnapshot.key+"' data-answer='"+answer.key+"' data-author='"+ childSnapshot.val().author +"' src='./../../public/assets/cross.png'></div></div>").insertAfter($("#"+i)); 
         } else { 
          console.log("ANSWER ITERATOR: "+i); 
          $("<div class='answer'><div class='userCommentBox'><a href='../../users/"+answer.val().author+"'><div class='commentUsername'>"+answer.val().username+"</div><img class='userPic' src='https://storage.googleapis.com/gaminghub-upload/"+answer.val().profilepic+"' /></div></a><div class='comment'>"+answer.val().text+"</div><div><img class='answerCross' data-post='"+postKey+"' data-comment='"+childSnapshot.key+"' data-answer='"+answer.key+"' data-author='"+ childSnapshot.val().author +"' src='./../../public/assets/cross.png'></div></div>").insertAfter($("#"+i)); 
         } 
        }); 
       }); 
      } 

Answer 1

這似乎涉及到JavaScript closure inside loops – simple practical example。一項決議，放線

var that = $(this); 

行

let j=i 

然後追加J即可回答迭代器

console.log("ANSWER ITERATOR: "+j);