循環通過JSON數組：未捕獲的語法錯誤，未捕獲的引用錯誤

我還是新的JQuery，我試圖用它遍歷JSON數組並更新我的網頁與數組中的數據。循環通過JSON數組：未捕獲的語法錯誤，未捕獲的引用錯誤

JSON文件看起來是這樣的：

[ 
    { 
     "firstname":"John", 
     "lastname":"Doe", 
     "studentnumber":"666" 
    }, 
    { 
     "firstname":"Foo", 
     "lastname":"Bar", 
     "studentnumber":"777" 
    } 
]

我的HTML文件看起來是這樣的：

<!DOCTYPE html> 
<html> 
    <head> 
     <script type="text/javascript" src="jquery-2.2.3.js"></script> 
     <script type="text/javascript"> 
      $(document).ready(function(){ 
       console.log('ready'); 
       $.getJSON('us.json', function(data){ 
        $.each(JSON.parse(data), function(key, value){ 
         $.each(value, function(index, member){ 
          html += '<div class="member">'; 
          html += '<h4>' + member.firstname + ' ' + member.lastname +'</h2>'; 
          html += '<p>' + 'has the following member number:' + member.studentnumber + '</p>'; 
          html += '</div>'; 
          console.log(html) 
         }) 
        }); 
        $('#members').html(html); 
       }); 
      }); 
     </script> 
    </head> 

    <body> 
     <div> 
      <h3>Members</h3> 
     </div> 
     <div id="members"></div> 
    </body> 
</html>

你可以看到，我試圖用.each函數來完成這項任務。上面的代碼是給下面的錯誤：

VM2028:1 Uncaught SyntaxError: Unexpected token o 
(anonymous function) @ index-v1.html:10 
fire     @ jquery-2.2.3.js:3187 
self.fireWith  @ jquery-2.2.3.js:3317 
done     @ jquery-2.2.3.js:8785 
(anonymous function) @ jquery-2.2.3.js:9151

在以前的一些問題，在這裏尋找後，我試圖與剛剛data更換JSON.parse(data)，這導致了以下錯誤：

Uncaught ReferenceError: html is not defined 
(anonymous function) @ index-v1.html:12 
jQuery.extend.each @ jquery-2.2.3.js:371 
(anonymous function) @ index-v1.html:11 
jQuery.extend.each @ jquery-2.2.3.js:365 
(anonymous function) @ index-v1.html:10 
fire     @ jquery-2.2.3.js:3187 
self.fireWith  @ jquery-2.2.3.js:3317 
done     @ jquery-2.2.3.js:8785 
(anonymous function) @ jquery-2.2.3.js:9151

可能是什麼造成這些問題，我該如何解決它們？

來源

2016-04-27 JavascriptLoser

「在以前的一些問題，在這裏尋找後，我試着更換JSON.parse（數據）只是數據」 - 錯誤...所以你在你的問題標題解決了這一問題已經... – Quentin

@Quentin你對，這個標題措辭不好。我現在編輯它。 – JavascriptLoser

錯誤原因：JSON.parse()需要一個文本但對象被傳遞。（感謝@Rayon）

由於data已經是JSON格式，也沒有必要上使用JSON.parse()的。

$.getJSON('us.json', function(data){ 

    // Problem is here 
    $.each(JSON.parse(data), function(key, value) {

不解析data

$.getJSON('us.json', function(data) { 
    $.each(data, function(key, value) {

對於第二個錯誤

Uncaught ReferenceError: html is not defined

使用它之前定義html變量。

var html = ''; // Add before `each`.

而且，也沒有必要的嵌套each如在第一each傳遞的數據是已經member對象。這是使用Array#forEach編寫的代碼。

$.getJSON('us.json', function (data) { 
    var html = ''; 
    data.forEach(function(member) { 
     html += '<div class="member">'; 
     html += '<h4>' + member.firstname + ' ' + member.lastname + '</h2>'; 
     html += '<p>' + 'has the following member number:' + member.studentnumber + '</p>'; 
     html += '</div>'; 
    }); 

    $('#members').html(html); 
});

來源

2016-04-27 05:51:08 Tushar

錯誤原因：_'JSON.parse'需要一個'text'但是'object'通過.._ – Rayon

@Rayon謝謝。添加。 – Tushar

這已修復了發生的錯誤，謝謝。不過，您的代碼似乎跳過了JSON數組中的第一個對象。這可能是什麼原因？ – JavascriptLoser

循環通過JSON數組：未捕獲的語法錯誤，未捕獲的引用錯誤

回答

相關問題