循環數組和輸出HTML

我正在循環一個數組，並將結果附加到頁面上的HTML元素。循環數組和輸出HTML

這裏是我的JavaScript/jQuery的：

var numberOfFiles = email.file_id.length; 
for (var fileIndex = 0; fileIndex < numberOfFiles; fileIndex++) { 
    fileHTML += '<a href="downloadAttachment.php?file_id=' + email.file_id[fileIndex] + '" target="_blank">' + email.file_name[fileIndex] + '</a><br>'; 
    emailOpened.find('.file-attachment-wrapper').append(fileHTML); 
}

環路工程，並追加內容到我的HTML，然而，有一個小錯誤。我的數組中的第一個項目追加了兩次。

這裏是我的陣列看起來像循環之前：

["file1.png", "file2.pdf"]

循環結束後，生成的HTML看起來像這樣：

<a href="downloadAttachment.php?file_id=54d38004fdf902cb758b456a" target="_blank">file1.png</a><br> 
<a href="downloadAttachment.php?file_id=54d38004fdf902cb758b456a" target="_blank">file1.png</a><br><a href="downloadAttachment.php?file_id=54d38004fdf902cb758b456b" target="_blank">file2.pdf</a><br>

正如你所看到的，file1.png是被添加兩次。我不知道爲什麼會發生這種情況。任何幫助表示讚賞！

來源

2015-02-05 three3

爲什麼在循環之前數組中有值？這可能是爲什麼你看到file1兩次，因爲它在數組中，然後循環再次添加它。稍後開始計數或在開始時沒有任何數組。 – Slime 2015-02-05 16:30:11

在運行JS之前，html的外觀如何？ – Steve 2015-02-05 16:31:15

+ =與append結合，你說追加file1，然後追加file1 + file2，然後它會被追加file1 + file2 + file3這看起來像file1，file1 + file2，file1 + file2 + file3 。只要刪除+ =並讓它=，你應該很好去。 – 2015-02-05 16:31:29

因爲您使用的是+=。這使它附加到以前的HTML。用簡單的=代替它，它會起作用。

現在它會是這樣的：

(i=0) 
file1 

(i=1) 
file1 
file2 

(i=3) 
file1 
file2 
file3

而且它結束了多次印刷較早的。

來源

2015-02-05 16:30:19 Scimonster

謝謝！不能相信我沒有聽到：]當我讓我接受你的答案 – three3 2015-02-05 16:31:37

嘗試通過fileHTML =

編輯改變fileHTML +=：

你應該把追加碼外循環，而不是，它的效率更高。

var numberOfFiles = email.file_id.length; 
var fileHTML = ""; 
for (var fileIndex = 0; fileIndex < numberOfFiles; fileIndex++) { 
    fileHTML += '<a href="downloadAttachment.php?file_id=' + email.file_id[fileIndex] + '" target="_blank">' + email.file_name[fileIndex] + '</a><br>'; 
} 
emailOpened.find('.file-attachment-wrapper').append(fileHTML);

來源

2015-02-05 16:31:47

循環數組和輸出HTML

回答

相關問題