jQuery中$.getJSON()方法详解

JSON 指的是 JavaScript 对象表示法（JavaScript Object Notation）,当我们建立一个JSON文件时，利用$.getJSON()方法可以调用该文件里的数据。下面是该方法的详解：

1.语法：

$.getJSON(url,[data],[callback]: )   //url为你建立的json文件或者是规定将请求发送的哪个 URL，必须写; data为可选，规定连同请求发送到服务器的数据;  function(){}为可选，为载入成功时的回调函数

2.$.getJSON()的同步异步问题：

$.getJson()本身是异步操作的方法，需要经过设置才能够同步，可以在执行之前加下面的代码语句将其改为同步执行。

$.ajaxSettings.async = false

3.实例：

（1）首先定义了一个名为promotionInfo的json文件，内容为：

  ["可口可乐", "雪碧", "方便面"]

在另一个js文件的函数中获取json文件中定义的数据：

//getJSON()方法的同步操作：
function computePromotionCount(goodsInfo) {
    $.ajaxSettings.async=false;    //将getJSO()方法设置为同步操作的方法
    $.getJSON("../js/promotionInfo.json",function(info){ //info为从json文件里获取到的所有数据
     _.each(goodsInfo, function (item){
         item.promotionCount = (info.indexOf(item.name)>-1) ? parseInt(item.count/3):0;
        })
    })                 //获取json文件里的数据，获取成功后执行function函数
    return goodsInfo;   
}

（2）定义了一个名为cartList.json的json文件，内容为：

[
{"classification": "饮料","name": "可口可乐","price": "3", "unit": "瓶" ,"id":"0"},
{"classification": "饮料","name": "雪碧", "price" : "3",  "unit": "瓶","id":"1"},
{"classification": "水果", "name": "苹果", "price" : "5.5", "unit": "斤","id":"2"},
{"classification": "水果", "name": "荔枝",  "price": "15",   "unit": "斤","id":"3"},
{"classification": "生活用品","name": "电池", "price" : "2", "unit": "个","id":"4"},
{"classification": "食品", "name": "方便面",  "price": "4.5", "unit": "袋","id":"5"}
]

在另一个js文件的函数中获取json文件中定义的数据：

//getJSON()方法的异步操作：
function addClickEvent(){
   $.getJSON("../js/cartList.json",function(info){    //info为从cartlist.json文件里获取到的数据
       var goodsName=JSON.parse(localStorage.getItem("goodsName"))||[ ];
       $(".button").click( function(){
           saveCount();
           var ID=this.id;
           var cartName=info[ID].name;
           addCartCount(ID,cartName,goodsName,info);
           addGoodsNameArray(ID,cartName,goodsName,info);
       })
   })
}

jQuery中$.getJSON()方法详解

猜你喜欢