jQuery ajax - getJSON() ກົນລະບົບ

ຄວາມຍອດ

ນຳໃຊ້ AJAX ຂໍ້ຮຽກຮ້ອງເພື່ອຮັບຂໍ້ມູນ JSON ແລະອອກສະພາບ:

$("button").click(function(){
  $.getJSON("demo_ajax_json.js",function(result){
    $.each(result, function(i, field){
      $("div").append(field + " ");
    });
  });
});

ທ້າວທາງຄົ້ນຄວ້າ

ການສະແດງ ແລະ ການນໍາໃຊ້

ຂໍ້ມູນ JSON ທີ່ບັນທຶກໂດຍ HTTP GET.

ໃນ jQuery 1.2, ເຈົ້າສາມາດໃຊ້ການຮັບສະແດງ JSONP ທີ່ກັບບັນຫາຫຼັງ JSON ອື່ນໆ, ອີງຕາມ "myurl?callback=?". jQuery ຈະເຮັດການປ່ຽນ ? ເປັນນາມການສະແດງ, ເພື່ອດຳເນີນການສະແດງ. ສັງເກດ: ຄຳຂັດແຍ່ງຕໍ່ມາຈະດຳເນີນກ່ອນການສະແດງກັບການສະແດງ.

ຄຼີສວຽງ

jQuery.getJSON(url,data,success(data,status,xhr)})
ມາດຕະການ ອະທິບາຍ
url ສຳຄັນ. ກຳນົດສະຖານນີ URL ທີ່ຈະສົ່ງຂໍ້ຮຽກ.
data ຄວນ. ກຳນົດຂໍ້ມູນທີ່ຈະສົ່ງຫາບໍລິການ.
success(data,status,xhr)}

ຄວາມຄິດສະຫຼາຍ. ກໍານົດກົນລະບົບ ເພື່ອດຳເນີນຕາມເວລາທີ່ຂໍ້ມູນຂໍ້ມູນທີ່ຂໍ້ມູນຈະສຳເລັດ.

ຄຳນວນພິມຕ້ອງການ

  • response - ບັນດາຂໍ້ມູນຈາກການຂໍຂອງຂໍ້ມູນ
  • status - ບັນດາສະຖານະຂອງການຂໍຂອງຂໍ້ມູນ
  • xhr - ບັນຈຸ XMLHttpRequest

ຂໍ້ສະເພາະ

ກົນລະບົບ ສັນຍາລວມ Ajax, ທີ່ມີຄວາມຮູບຮ່າງ:

$.ajax({
  url: url,
  data: data,
  success: callback,
  dataType: json
});

ຂໍ້ມູນທີ່ສົ່ງຕໍ່ຜູ້ຄ້າງບໍລິການ ສາມາດຕິດຕາມເປັນຄຳນວນຄຳນັກພິມ ພາຍຫຼັງ URL. ຖ້າ data ຄຳນວນຂອງຄຳນັກພິມ ແມ່ນວັດຖຸ (ມາດຕະຖານ), ຈະຖືກແປງເປັນຄຳນວນແບບສະແດງ ແລະ ປະກອບການການກົບສັນຍາວ.

ສົ່ງຕໍ່ callback ຂໍ້ມູນກັບການກັບຄືນອາດເປັນວັດຖຸ JavaScript, ຫຼື ຈັດຕັ້ງຄວາມຄົບຮູບ JSON, ແລະ ນຳໃຊ້ ກົນລະບົບ $.parseJSON() ທີ່ການກວດສອບ.

ຕົວຢ່າງ

ລ່າງຈາກ test.js ອັດຕາ JSON ຂໍ້ມູນ ແລະ ສະແດງຂໍ້ມູນຂອງພັກພາສາ name:

$.getJSON("test.js", function(json){
  alert("JSON Data: " + json.users[3].name);
});

ຕົວຢ່າງອື່ນ

ຕົວຢ່າງ 1

ລ່າງຈາກ Flickr JSONP API ອັດຕາ 4 ຮູບພາບຫຼັງກັບປະເພດໝາ:

HTML 代码:

<div id="images"></div>

jQuery 代码:


$.getJSON("http://api.flickr.com/services/feeds/photos_public.gne?
tags=cat&tagmode=any&format=json&jsoncallback=?", function(data){
  $.each(data.items, function(i,item){
    $("<img/>").attr("src", item.media.m).appendTo("#images");
    if ( i == 3 ) return false;
  });
});

ຕົວຢ່າງ 2

ລ່າງຈາກ test.js ອັດຕາ JSON ຂໍ້ມູນ, ການຕິດຕາມຄຳນັກພິມ, ສະແດງຂໍ້ມູນຂອງພັກພາສາ name:

$.getJSON("test.js", { name: "Bill", time: "2pm" }, function(json){
  alert("JSON Data: " + json.users[3].name);
});