jQuery ajax - طريقة getJSON()

jQuery Ajax مرجع

مثال

استخدام طلب 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، يمكنك تحميل بيانات JSON من مجال آخر باستخدام شكل JSONP من وظائف التلقي، مثل "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 إذا كان قيمة المعلمة هي جسم (خريطة)، يتم تحويلها إلى سلسلة وتمريرها عبر الترميز URL قبل إضافتها إلى URL.

تمريرها إلى callback البيانات العائدة، يمكن أن تكون جسم JavaScript، أو مصفوفة معينة بـ JSON، وتستخدم طريقة $.parseJSON() لتحليلها.

مثال

من test.js تحميل بيانات JSON وعرض بيانات ميدان name في بيانات JSON:

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

مزيد من الأمثلة

مثال 1

من API JSONP لـ Flickr تحميل 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");
    إذا (i == 3) عودة false;
  );
);

مثال 2

من test.js تحميل بيانات JSON، إضافة معلمات، عرض بيانات اسم ميدان JSON:

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

jQuery Ajax مرجع