روش getScript() jQuery ajax

دستورالعمل jQuery Ajax

مثال

با استفاده از درخواست AJAX یک فایل JavaScript را دریافت و اجرا کنید:

$("button").click(function(){
  $.getScript("demo_ajax_script.js");
});

آزمایش کنید

تعریف و استفاده

روش getScript() از طریق درخواست HTTP GET فایل JavaScript را بارگذاری و اجرا می‌کند.

زبان نوشتاری

jQuery.getScript(url,success(response,وضعیت});
پارامترها توضیح
url URL درخواستی به صورت رشته.
success(response,status)

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

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

  • response - داده‌های نتیجه درخواست را شامل می‌شود
  • وضعیت - وضعیت درخواست را شامل می‌شود ("موفقیت", "بدون تغییر", "خطا", "زمان اتمام", یا "خطا در پردازش")

شرح جزئی

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

$.ajax({
  url: url,
  dataType: "script",
  موفقیت: موفقیت
});

فункциون بازگشتی که در اینجا استفاده می‌شود، فایل JavaScript بازگشتی را انتقال می‌دهد. این معمولاً چندان مفید نیست، زیرا در آن زمان اسکریپت اجرا شده است.

اسکریپت بارگذاری شده در محیط جهانی اجرا می‌شود، بنابراین می‌تواند از متغیرهای دیگر استفاده کند و از توابع jQuery استفاده کند.

مثلاً بارگذاری یک فایل test.js که شامل این کد زیر است:

$(".result").html("<p>Lorem ipsum dolor sit amet.</p>");

با اشاره به این نام فایل، می‌توان این اسکریپت را بارگذاری و اجرا کرد:

$.getScript("ajax/test.js", function() {
  alert("Load was performed.");
});

توضیحات:قبل از نسخه 1.2 jQuery، getScript فقط می‌توانست فایل‌های JS هم‌دامنه را فراخوانی کند. در نسخه 1.2، می‌توانید فایل‌های JavaScript را از دامنه‌های مختلف فراخوانی کنید. توجه داشته باشید: نسخه‌های 2 یا قدیمی‌تر از Safari نمی‌توانند اسکریپت‌ها را در محدوده‌ی جهانی به صورت همزمان اجرا کنند. اگر اسکریپت‌ها را با استفاده از getScript اضافه کنید، باید از تابع تأخیر استفاده کنید.

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

مثال 1

بارگذاری و اجرای test.js:

$.getScript("test.js");

مثال 2

بارگذاری و اجرای test.js، بعد از موفقیت پیام نمایش داده می‌شود:

$.getScript("test.js", function(){
  alert("Script loaded and executed.");
});

مثال 3

بارگذاری پلاگین رسمی انیمیشن رنگ jQuery بعد از موفقیت، تغییر رنگ با استفاده از انیمیشن پیوند داده می‌شود:

کد HTML:

<button id="go">Run</button>
<div class="block"></div>

کد jQuery:

jQuery.getScript("http://dev.jquery.com/view/trunk/plugins/color/jquery.color.js",
 function(){
  $("#go").click(function(){
    $(".block").animate( { backgroundColor: 'pink' }, 1000)
      .animate( { backgroundColor: 'blue' }, 1000);
  });
});

دستورالعمل jQuery Ajax