Question

嘿伙计们，我想知道如何通过ajax调用获取json数据。

我试过这个，但似乎行不通：P

首先，我创建了一个JavaScript文件，放在我的json数据元素中：

var food = [
             {'name':'bread', 'price':'7,25'},
             {'name':'fish', 'price':'9,00'}
           ];

我把它保存为food.js。

然后我尝试从另一个文件进行ajax调用，这是我的代码：

$(document).ready(function(){

    $.ajax({
        async: false,
        dataType: "json",
        type:'GET',
        url:"food.js",
        success: function(data) {

            var result = data.food.name;
            alert(result);

        });

    }});

});

有什么想法吗？

提前致谢;）

Answer 1

首先，您的示例中存在语法错误 - $.ajax调用中的结束括号太多，但我认为这只是一个错字。

在您的JSON中，food是一个数组，因此您需要使用索引器来获取其中对象的属性：

success: function(data) {
    var result = data.food[0].name; // = "bread"
    alert(result);
});

Answer 2

试试这个

$(document).ready(function() {
    $.ajax({
        async: false,
        dataType: "json",
        type:'GET',
        url:"food.js",
        success: function(data) {
            var result = data.food[0].name;
            alert(result);
        }
   });
});

Answer 3

您需要遍历返回的data，因为它是一个数组：

$.each(data,function(i,val) {
    alert(data[i].name);
});

Answer 4

您可能希望在jquery中使用getJSON函数：http://api.jquery.com/jquery.getjson/

$.getJSON( "food.json", function( data ) {
    //here your callback
}

默认情况下，它会将数据类型设置为json，方法设置为GET。

您还应该使用.json扩展名而不是js扩展名为jsons。并将其格式化为适当的json：

{
    "food": [
        {
            "name": "bread",
            "price": 7.25
        },
        {
            "name": "fish",
            "price": 9.00
        }
    ],
}

您可以使用此网站来帮助您格式化jsons：http://www.jsoneditoronline.org/

您尝试调用元素的方式无效。您获得的数据是一个数组。在回调中，您可以尝试：

console.log(data)
console.log(data.food)
console.log(data.food[0])
console.log(data.food[0].name)
console.log(data.food[0].price)

最后，请注意您使用昏迷格式化数字，这不是您在javascript中格式化数字的方式。使用点，这样您就可以将其作为数字进行操作。

Answer 5

我喜欢人们完全无视你的食物和食物的事实。不是JSON字符串，它是JavaScript代码。这可能适用于基于eval的旧学校＆＃34; JSON＆＃34;，但是使用jQuery AJAX，您的目标文件应该是普通的JSON。从头开始删除var food =，从结尾删除;。

然后您可以访问data.food[0].name;

Answer 6

在这种情况下，您试图通过ajax获取另一个javascript文件。为此，您可以＆＃34;包括＆＃34;使用Ajax GetScript（see here）在您的页面中使用您的脚本（food.js）。

直接请求json文件时，您的代码更好。

用jquery获取json数据

6 个答案: