使用JQuery从本地URL解析JSON

时间:2011-11-05 15:06:53

标签: javascript json jquery getjson

我有一个本地网址,我可以在其中检索json文件。我还有一个使用JQuery构建的简单网站。

我查了很多网站上的教程和示例代码,了解如何检索json输入并解析它,以便我可以在我的网站上显示它。然而非有用,因为我仍然无法使它工作。

所以作为最后的手段,我将要求s​​tackoverflow提供帮助。我有很多java知识,但我对'web'开发相对较新,并且了解一些javascript的基础知识。

这是我的网址的示例输出:

[
    {
        "baken": "not implemented...",
        "deviceType": "Optimus 2X",
        "batteryLevel": "1.0",
        "gps": {
            "speed": 0,
            "Date": "TueNov0100: 34: 49CET2011",
            "Accuracy": 35,
            "longitude": 4.605317973435014,
            "latitude": 51.916573265802846,
            "Provider": "gps"
        },
        "deviceId": "4423"
    },
    {
        "baken": "notimplemented...",
        "deviceType": "iPhone",
        "batteryLevel": "30.0",
        "gps": {
            "speed": 0,
            "Date": "TueNov0116: 18: 51CET2011",
            "Accuracy": 65,
            "longitude": 4.462571,
            "latitude": 51.90987,
            "Provider": null
        },
        "deviceId": "4426"
    }
]

希望你能帮帮我..

5 个答案:

答案 0 :(得分:6)

如果您正在运行本地Web服务器并且网站和json文件由它提供服务,您可以执行以下操作:

$.getJSON('path/to/json/file.json', function(data) {
  document.write(data);
})

如果您只是使用文件而没有网络服务器,则可能会出现浏览器的origin-policy问题,因为无法通过跨域发送AJAX请求,并且对于本地文件的请求,默认情况下源域为“null”

如果您使用的是Chrome,则可以尝试使用--allow-file-access-from-files参数进行开发。

答案 1 :(得分:2)

您的网址返回无效的json。尝试在jsonlint.com中粘贴它并在那里验证它,你会明白我的意思。甚至在stackoverflow上突出显示的代码也向您显示错误。 :)

编辑:要解析它,您可以使用jQuery.parseJSON

 jQuery.parseJSON('{"foo": "goo"}');

答案 2 :(得分:1)

$.get('/some.json', function(data) {
  // data[0]["baken"] == "not implemented..."
});

请参阅http://api.jquery.com/jQuery.get/

答案 3 :(得分:1)

最自然的方法是允许jQuery在您进入页面后为您进行AJAX调用。这是一个例子:

    $.ready(function() {

         // put your other code for page initialization here

         // set up a global object, for namespacing issues, to hold your JSON.
         // this allows your to be a good "web" citizen, because you will create
         // one object in the global space that will house your objects without
         // clobbering other global objects from other scripts, e.g., jQuery
         // makes the global objects '$' and 'jQuery' 
         myObjects = {};

         // start JSON retrieval here
         $.getJSON('/path/to/json/file.json', function(data) {
             // 'data' contains your JSON.
             // do things with it here in the context of this function.
             // then add it to your global object for later use.
             myObjects.myJson = data; 
         });

    });

API文档为here

答案 4 :(得分:1)

你不需要解析json - 这就是人们喜欢它的原因。它成为本机JavaScript对象。

对于您的示例,如果您将结果放在名为data的变量中,那么您可以执行以下操作:

 data[0].deviceType // would be "Optimus 2x"
 data[0].gps.speed  // would be numeric 0