jQuery ajax - getScript() metod

jQuery Ajax referenshandbok

Exempel

Få och kör en JavaScript-fil via AJAX-förfrågan:

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

Prova själv

Definition och användning

getScript() metoden laddar och kör JavaScript-filen via HTTP GET-förfrågan.

Syntaks

jQuery.getScript(url,success(response,status});
Parametrar Beskrivning
url URL-strängen som ska anropas.
success(response,status)

Valfritt. Anger vilken anropsskript som ska köras efter att förfrågan har lyckats.

Ytterligare parametrar:

  • response - Innehåller resultatdata från förfrågan
  • status - Innehåller status för förfrågan ("success", "notmodified", "error", "timeout" eller "parsererror")

Detaljerad förklaring

Denna funktion är en förenklad Ajax-funktion, ekvivalent med:

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

Här kommer anropetsskriptet att ansluta till tillbaka returnerade JavaScript-filen. Det är vanligtvis inte så användbart, eftersom då har skriptet redan kört.

Laddade skript körs i globalt sammanhang, och kan därmed hänvisa till andra variabler och använda jQuery-funktioner.

Till exempel ladda in en test.js-fil som innehåller följande kod:

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

Genom att referera till filnamnet kan du ladda in och köra detta skript:

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

Kommentar:Före jQuery 1.2 kunde getScript endast anropa JS-filer från samma domän. I version 1.2 kan du anropa JavaScript-filer över domäner.Observera: Safari 2 eller tidigare versioner kan inte köra skript i globalt syfte. Om du lägger till skript med getScript, använd en fördröjningsfunktion.

Mer exempel

Exempel 1

Ladda och kör test.js:

$.getScript("test.js");

Exempel 2

Ladda och kör test.js, visa information efter framgång:

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

Exempel 3

Ladda in jQuery officiell färganimation plugin Binds färgändringsanimation efter framgång:

HTML-kod:

<button id="go">Kör</button>
<div class="block"></div>

jQuery-kod:

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 referenshandbok