Question

我真的有点困惑：

我在名为：data.json

的文件中有以下JSON数据

{
   "locations": [
      {
         "title": "The Space Needle",
         "latitude": 47.619,
         "longitude": -122.348
      },
      {
         "title": "Albany",
         "latitude": 46,
         "longitude": -74
      }
   ]
}

当我使用以下代码尝试显示数据时，我什么都没得到：

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
<title>Another gone south</title>
<script src="http://code.jquery.com/jquery-1.8.0.min.js" type="text/javascript" charset="utf-8"></script>
<script type="text/javascript">
/* <![CDATA[ */
$(document).ready(function(){
    $.getJSON("data.json",function(data){
        $.each(data.locations, function(i,location){
                content += '<p>' + location.title + '</p>';
                content += '<p>' + location.latitude + '</p>';
                content += '<p' + location.longitude + '</p>';
                content += '<br/>';
                alert('aler called');
                $(content).appendTo("#loc");
        });
    });   
});
/* ]]> */
</script>
</head>
<body>
        <div class="container">
                <div class="span-24">
                       <h2>Check out the following locations:</h2>
                                        <div id="loc">
                                        </div>
                </div>
        </div>
</body>
</html>

Answer 1

假设您的json被返回，您的循环似乎很好~~您可能需要做的唯一事情是在使用它之前解析您的JSON结果~~：

我在JayC说了之后再次看了这个，我把JSON值添加到我的例子中给了一个字符串（d＆＃39;哦），当然我把它作为一个对象，每个都工作得很好

使用JSON对象（不是字符串）

查看DEMO

基本上你的代码应该可以正常工作，这意味着请求会产生错误，或者你只是没有返回任何内容。

检查浏览器中的调试控制台是否有任何错误。在FF中，您可以使用FireBug或在Chrome中使用内置的IE。

Answer 2

只是一个疯狂的镜头，你使用的浏览器是什么？它不是Chrome吗？它也不适用于Firefox吗？因为我在Firefox中尝试过并且它可以正常工作，所以显示数据和警报。在Chrome中我收到错误

XMLHttpRequest无法加载file：/// PATH。 Access-Control-Allow-Origin不允许使用null。

经过一番挖掘，我发现它可能是chrome的问题，你可能需要用

运行它

chrome.exe --allow-file-access-from-file

您可能还需要定义变量'content'（对于chrome），例如：

$(document).ready(function(){
    content = $(this).html();
    $.getJSON("data.json",function(data){
        $.each(data.locations, function(i,location){
                content += '<p>' + location.title + '</p>';
                content += '<p>' + location.latitude + '</p>';
                content += '<p' + location.longitude + '</p>';
                content += '<br/>';
               alert('aler called');
             $(content).appendTo("#loc");
        });
    });   
});

这种方式适用于Chrome和Firefox（在我的电脑上）。把它们加起来：这似乎是Chrome的问题，应该可以在外部服务器上运行。

Chrome issue link

显示JSON数据

2 个答案: