مетод getJSON() jQuery ajax

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، می‌توانید از فرم JSONP برای بارگذاری داده‌های JSON از دامنه‌های دیگر استفاده کنید، مانند "myurl?callback=?". jQuery به طور خودکار ? را با نام صحیح تابع جایگزین می‌کند تا تابع بازگشتی را اجرا کند. توجه داشته باشید: کد‌های بعدی قبل از اجرای این تابع بازگشتی اجرا می‌شوند.

نحوه استفاده

jQuery.getJSON(url,داده‌ها,success(data,status,xhr)})
پارامترها توضیحات
url ضروری. تعریف می‌کند که کدام URL درخواست ارسال می‌شود.
داده‌ها اختیاری. تعریف داده شده برای داده‌هایی که با درخواست به سرور ارسال می‌شوند.
success(data,status,xhr)}

اختیاری. توابعی که باید در صورت موفقیت درخواست اجرا شوند را مشخص می‌کند.

پارامترهای اضافی:

  • response - شامل داده‌های نتیجه درخواست
  • status - شامل وضعیت درخواست
  • xhr - شامل شیء XMLHttpRequest

شرح جزئی

این تابع یک تابع Ajax کوتاه شده است، معادل با:

$.ajax({
  url: url,
  data: داده‌ها,
  success: کالبک,
  dataType: json
);

داده‌هایی که به سرور ارسال می‌شوند می‌توانند به عنوان یک رشته به بعد از URL اضافه شوند. اگر داده‌ها اگر مقدار پارامتر یک شیء (مپ) باشد، قبل از اضافه کردن به URL به یک رشته تبدیل شده و کدگذاری URL انجام می‌شود.

به کالبک داده‌های بازگشتی می‌تواند یک شیء JavaScript باشد یا یک آرایه که با استفاده از روش $.parseJSON() تعریف شده است و سپس آن را تحلیل می‌کند.

مثال

JSON داده‌های test.js را بارگذاری کنید و یک فیلد name در داده‌های JSON را نمایش دهید:

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

مثال‌های بیشتر

مثال 1

4 عکس جدید مربوط به گربه از API JSONP Flickr بارگذاری کنید:

کد 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

JSON داده‌های test.js را بارگذاری کنید، پارامترهای اضافی را اضافه کنید، و داده‌های یک فیلد name در داده‌های JSON را نمایش دهید:

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

jQuery Ajax مرجع کتاب