循环通过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数组：未捕获的语法错误，未捕获的引用错误

回答

相关问题