Question

但是我在json中得到了反响，即警报（html）

<script>
function addcartAction(id){
var dataString='id='+id;

    $.ajax({
    type: "POST",
    url:"<?php echo Yii::app()->request->baseUrl; ?>/testurl",
    data: dataString,
    success: function(html)
    { 

    alert(html);

        $("#cart-item").html(html);
    }
    });

}

</script>



{
        "1": {
            "ItemName": "Product1",
            "id": "1",
            "item_Image": "http://testurl.com/gallerythumb/test.JPG",
            "price": "4.99",
            "quantity": 1
        },
        "2": {
            "ItemName": "Product2",
            "id": "2",
            "item_Image": "http://testurl.com/gallerythumb/test1.jpg",
            "price": "7.99",
            "quantity": 12
        }
    }

我尝试了很多不同的语法，但似乎无法解决这个问题。任何人都可以指出我正确的方向吗？所以我可以解决这个问题。

Answer 1

获得json字符串后，使用返回对象的parseJSON() function。然后，您可以访问它的属性，如文档中所示。

您也可以参考：

Answer 2

您可以使用 $.each 来迭代JavaScript对象

var data = {
  "1": {
    "ItemName": "Product1",
    "id": "1",
    "item_Image": "http://testurl.com/gallerythumb/test.JPG",
    "price": "4.99",
    "quantity": 1
  },
  "2": {
    "ItemName": "Product2",
    "id": "2",
    "item_Image": "http://testurl.com/gallerythumb/test1.jpg",
    "price": "7.99",
    "quantity": 12
  }
};

$.each(data,function(i, v) {
  console.log(i);
  $.each(v,function( ind , val) {
    console.log( ind , val);
  });
});

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>

Answer 3

这样的事情！

＆＃13;

var data={
    "1": {
        "ItemName": "Product1",
        "id": "1",
        "item_Image": "http://testurl.com/gallerythumb/test.JPG",
        "price": "4.99",
        "quantity": 1
    },
    "2": {
        "ItemName": "Product2",
        "id": "2",
        "item_Image": "http://testurl.com/gallerythumb/test1.jpg",
        "price": "7.99",
        "quantity": 12
    }
};
$.each(data,function(key,value){
    var element='<div class="elem">Item No : '+key+
                ' <span>Item Name : '+value.ItemName+'</span> '+
                ' <span>Id : '+value.id+'</span> '+
                ' <img src="'+value.item_Image+'"/> '+
                ' <span>Price: '+value.price+'</span> '+
                ' <span>Quantity : '+value.quantity+'</span></div> ';
    $('body').append(element);
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>

＆＃13;

<强>更新

假设您关注ajax

$.ajax({
   url:'someurl',
   type:'POST',
   dataType:'json',
   success: function(data)
   { 
       $.each(data,function(key,value){
           var element='<div class="elem">Item No : '+key+
                       ' <span>Item Name : '+value.ItemName+'</span> '+
                       ' <span>Id : '+value.id+'</span> '+
                       ' <img src="'+value.item_Image+'"/> '+
                       ' <span>Price: '+value.price+'</span> '+
                       ' <span>Quantity : '+value.quantity+'</span></div> ';
             $('body').append(element); //append it to anywhere in DOM using selector
      });
    },
    error:function(jqXHR,responseData,status){
        //do something
    }
});

Answer 4

您需要查看使用JSON请求加载HTTP GET数据（您也可以使用POST）。

JSON jQuery语法：

jQuery.getJSON( url, [ data ], [ success(data, textStatus, jqXHR) ] );

url - 包含请求发送到的URL的字符串。

data - 使用请求发送到服务器的映射或字符串。

success（data，textStatus，jqXHR） - 请求成功时执行的回调函数。

Download Example

代码参考here。

如何在jquery + ajax中迭代json数据

4 个答案: