用jQuery读取JSON

时间:2017-02-04 14:53:53

标签: jquery json ajax

我在Ajax之后有一个JSON结果,如下所示

 {
"results": [

{
    "id": " 14903",
  "nsid" : "10438",
    "name": "001-2501220",
  "label":"001-2501220 End Seal",
  "price":"12.6"
}, 
{
    "id": " 14904",
  "nsid" : "10439",
    "name": "001-2501231",
  "label":"001-2501231 Poppet",
  "price":"12.3"
}, 
{
    "id": " 14917",
  "nsid" : "3391",
    "name": "PW16001",
  "label":"PW16001 Caliper Piston 38.1mm Lucas TRW handbrake",
  "price":"26.5"
} 
]}

我在阅读本文时遇到困难。我试过了

$.ajax({
          type: "POST",
          url: url,
          data: "partnumber=" +value,
          cache: false,
          success: function(data){
            console.log(data);
            for (var i in data.results) {
                var name = data.results[i].name;
                var text = data.results[i].label;
                console.log(name);
                console.log(text);
            }
          },
          error: function(xhr, status, error) {
              var err = eval("(" + xhr.responseText + ")");
              alert(err.Message);
          }
        });

但没有运气。

2 个答案:

答案 0 :(得分:1)

也许您的服务器没有发送正确的application/json Content-Type响应头,并且jQuery不知道它应该在将响应传递给success回调之前自动解析响应。因此,如果是这种情况,您可以在发出请求时明确指出内容类型:

dataType: 'json'

现在假设这个错误编写的服务器端脚本发送有效的JSON,jQuery将在将其提供给success回调之前正确解析它,以便您可以在结果元素上编写相应的循环。

这就是说,我建议您修复服务器端脚本,以便正确填充Content-Type响应。这将允许jQuery等客户端正确处理响应。

答案 1 :(得分:0)

确保您的JSON响应返回为data,而不是任何其他名称。此外,由于javascript是异步的,您需要在jquery ajax success()函数中执行此操作。您也可以在室外使用它,但这需要一些您需要以不同方式处理它。在你的ajax代码中添加dataType: "json"还有一件事,它会确保你返回的数据是有效的JSON,你可能需要解析它

$.ajax({
          type: "POST",
          url: url,
          data: "partnumber=" +value,
          cache: false,
          dataType: "json",
          success: function(data){

            var data = JSON.parse(data);
            console.log(data);
            for (var i in data.results) {
                var name = data.results[i].name;
                var text = data.results[i].label;
                console.log(name);
                console.log(text);
            }
          },
          error: function(xhr, status, error) {
              var err = eval("(" + xhr.responseText + ")");
              alert(err.Message);
          }
        });

var data = {
"results": [

{
    "id": " 14903",
  "nsid" : "10438",
    "name": "001-2501220",
  "label":"001-2501220 End Seal",
  "price":"12.6"
}, 
{
    "id": " 14904",
  "nsid" : "10439",
    "name": "001-2501231",
  "label":"001-2501231 Poppet",
  "price":"12.3"
}, 
{
    "id": " 14917",
  "nsid" : "3391",
    "name": "PW16001",
  "label":"PW16001 Caliper Piston 38.1mm Lucas TRW handbrake",
  "price":"26.5"
} 
]}

$.each(data.results, function(key, val) {
console.log(val.name);
           console.log(val.id);
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>