2014-11-08 64 views
0

JSON陣列中一個jquery使用.append時。每個顯示陣列的只有最後一個值

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN"> 
 
<html> 
 
<head> 
 
<title>Javascript Array Table</title> 
 
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script> 
 
<meta name="" content=""> 
 
</head> 
 
<body> 
 

 
<table> 
 
    <thead> 
 
      <tr> 
 
       
 
       <th>Details</th> 
 
       <th>Data</th> 
 
       
 
      </tr> 
 
    </thead> 
 
    <tbody id="tbody"></tbody> 
 
</table> 
 

 

 
<script type="text/javascript"> 
 

 
//jQuery(document).ready(function() { 
 
function arrayprocess(){ 
 
\t \t 
 
\t \t var display; 
 
\t \t 
 
\t \t var arrayobj = [{"name": "John","dept": "science","phone": "xxx-xxx-xxxx"}]; 
 
\t \t \t 
 
\t \t jQuery.each(arrayobj, function(key, value){ \t 
 
\t \t \t 
 
\t \t \t jQuery.each(value, function(label, answer){ 
 
\t \t \t \t display = '<tr><td>'+label+ '</td><td>' +answer+'</td></tr>'}); 
 

 

 
\t \t }); 
 
\t \t $('#tbody').append(display); 
 
\t \t 
 

 
} 
 
arrayprocess(); 
 
//}); 
 
</script> 
 

 

 
</body> 
 
</html>

問題:顯示 的JSON只陣列的最後一個值。前兩個值的其餘部分也就是name:Johndept:science ...

本次輸出:

詳細數據

電話XXX-XXX-XXXX

期望輸出

詳情數據

名稱約翰

部門科學

電話XXX-XXX-XXXX

+1

您需要將'display + ='連接到顯示變量。 – mplungjan 2014-11-08 06:56:11

+0

awesome mplungjan!謝謝! – Neocortex 2014-11-08 07:07:12

回答

1

你的附加陳述必須在每個函數內,否則只會追加最後的結果,例如:

jQuery.each(arrayobj, function(key, value){ 

    jQuery.each(value, function(label, answer){ 
     display += '<tr><td>'+label+ '</td><td>' +answer+'</td></tr>'; 
    }); 
}); 
+0

@mplungjan你是對的,我只是捕捉他的錯誤,編輯我的答案更有效的方法 – 2014-11-08 06:59:56

+0

不客氣 – mplungjan 2014-11-08 07:00:10

+0

Mauricio Tranjano - 錯了......它不工作... – Neocortex 2014-11-08 07:08:35

相關問題