jQuery ajax - getScript() metodu

Örnek

AJAX istekleri aracılığıyla bir JavaScript dosyasını almak ve çalıştırmak:

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

Kişisel deneyim

Tanım ve kullanım

getScript() metodu, HTTP GET istekleri aracılığıyla JavaScript dosyasını yükler ve çalıştırır.

Gramer

jQuery.getScript(url,success(response,status});
Parametreler Açıklama
url İstenen URL dizgesi.
success(response,status)

İsteğe bağlı. İstek başarılı olduğunda çalıştırılacak geri çağrı fonksiyonunu belirler.

Ek parametreler:

  • response - İstekten gelen sonuç verilerini içerir
  • status - İstek durumunu içerir ("success", "notmodified", "error", "timeout" veya "parsererror")

Ayrıntılı açıklama

Bu fonksiyon, kısaltılmış Ajax fonksiyonudur ve şuyla eşdeğerdir:

$.ajax({
  url: url,
  dataType: "script",
  success: success
});

Bu geri çağrı fonksiyonu, döndürülen JavaScript dosyasını iletir. Bu genellikle çok faydalı değil, çünkü o zaman betik çalıştırmış olur.

Yüklenen senaryo genel ortamda çalışır, bu yüzden diğer değişkenleri referans alabilir ve jQuery fonksiyonlarını kullanabilir.

Örneğin, aşağıdaki kodu içeren bir test.js dosyasını yükleyin:

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

Bu dosya adını referans alarak bu senaryoyu yükleyip çalıştırabilirsiniz:

$.getScript("ajax/test.js", function() {
  alert("Yükleme gerçekleştirildi.");
});

Açıklama:jQuery 1.2 sürümünden önce, getScript yalnızca aynı alan adlı JS dosyalarını çağırabilirdi. 1.2'de, JavaScript dosyalarını alan sınırlamasız olarak çağırabilirsiniz. Dikkat: Safari 2 veya daha eski sürümler, genel alan içinde senkron olarak senaryoları çalıştıramaz. getScript ile senaryo eklediğinizde, gecikme fonksiyonu ekleyin.

Daha fazla örnek

Örnek 1

test.js dosyasını yükle ve çalıştır:

$.getScript("test.js");

Örnek 2

test.js dosyasını yükle ve çalıştır, başarılı olduktan sonra bilgi göster:

$.getScript("test.js", function(){
  alert("Script yüklendi ve çalıştırıldı.");
});

Örnek 3

Yükle jQuery resmi renk animasyon eklentisi Başarıyla bağlanan renk değişim animasyonu:

HTML kodu:

<button id="go">Çalıştır</button>
<div class="block"></div>

jQuery kodu:

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);
  });
});