Heim > Web-Frontend > js-Tutorial > Ausführliche Erklärung zur Implementierung einer Ajax-Anfrage in JQuery

Ausführliche Erklärung zur Implementierung einer Ajax-Anfrage in JQuery

伊谢尔伦
Freigeben: 2017-06-19 09:38:08
Original
1542 Leute haben es durchsucht

Ajax-Anfrage

jQuery.ajax(optionen)

Entfernte Daten per HTTP-Anfrage laden. jQuery zugrunde liegende AJAX-Implementierung. Einfache und benutzerfreundliche High-Level-Implementierungen finden Sie unter .get, .post usw.

.ajax() gibt das von ihm erstellte XMLHttpRequest-Objekt zurück. In den meisten Fällen müssen Sie dieses Objekt nicht direkt manipulieren, in besonderen Fällen kann es jedoch zum manuellen Beenden der Anfrage verwendet werden. .ajax() hat nur einen Parameter: Parameter-Schlüssel/Wert-Objekt, einschließlich aller Konfigurations- und Rückruffunktion-Informationen. Detaillierte Parameteroptionen finden Sie weiter unten.

Hinweis: Wenn Sie die Option dataType angeben, stellen Sie bitte sicher, dass der Server die richtigen MIME-Informationen zurückgibt (z. B. gibt XML „text/xml“ zurück). Falsche MIME-Typen können unvorhersehbare Fehler verursachen.

Hinweis: Wenn dataType auf „script“ gesetzt ist, werden bei Remote-Anfragen (nicht unter derselben Domäne) alle POST-Anfragen in GET-Anfragen umgewandelt. (Da zum Laden das DOM-Skript-Tag verwendet wird)

In jQuery 1.2 können Sie JSON-Daten domänenübergreifend laden. Bei der Verwendung müssen Sie den Datentyp auf JSONP festlegen. Beim Aufrufen einer Funktion im JSONP-Format, z. B. „myurl?callback=?“, ersetzt jQuery automatisch ? durch den richtigen Funktionsnamen, um die Callback-Funktion auszuführen. Wenn der Datentyp auf „jsonp“ eingestellt ist, ruft jQuery automatisch die Rückruffunktion auf.

Rückgabewert XMLHttpRequest

Parameter

Optionen (optional): AJAX-Anfrageeinstellungen. Alle Optionen sind optional.

Optionen

(1), asynchron (Boolean): (Standard: true)
Standardmäßig sind alle Anfragen asynchrone Anfragen. Wenn Sie synchrone Anfragen senden müssen, legen Sie diese Option auf „false“ fest. Beachten Sie, dass eine synchrone Anfrage den Browser sperrt und der Benutzer warten muss, bis die Anfrage abgeschlossen ist, bevor andere Vorgänge ausgeführt werden können.

(2) beforeSend (Funktion): Eine Funktion, die das XMLHttpRequest-Objekt vor dem Senden der Anfrage ändern kann, z. B. das Hinzufügen eines benutzerdefinierten HTTP-Headers.
Das XMLHttpRequest-Objekt ist der einzige Parameter. Dies ist ein Ajax-Event. Wenn false zurückgegeben wird, kann diese Ajax-Anfrage abgebrochen werden.

(3), Cache (Boolean): (Standard: true, Standard ist false, wenn dataType ein Skript ist)
neue Funktion von jQuery 1.2, auf false gesetzt, wird nicht aus dem Browser-Cache geladenInformationen anfordern .

(4), Complete (Funktion): Rückruffunktion nach Abschluss der Anfrage (wird aufgerufen, wenn die Anfrage erfolgreich ist oder fehlschlägt).
Parameter: XMLHttpRequest-Objekt und eine Zeichenfolge, die den erfolgreichen Anforderungstyp beschreibt. Dies ist ein Ajax-Ereignis

(5), contentType (String): (Standard: „application/x-www-form-urlencoded“) Inhaltskodierungstyp beim Senden von Informationen an den Server. Der Standardwert ist für die meisten Anwendungen geeignet.

(6), Daten (Objekt, String): An den Server gesendete Daten. Wird automatisch in das Anforderungszeichenfolgenformat konvertiert. Wird in GET-Anfragen an die URL angehängt. Informationen zum Deaktivieren dieser automatischen Konvertierung finden Sie in der Beschreibung der ProcessData-Option.
Muss im Schlüssel-/Wertformat vorliegen. Wenn es sich um ein Array handelt, weist jQuery verschiedenen Werten automatisch denselben Namen zu. Beispielsweise wird {foo:["bar1", "bar2"]} in '&foo=bar1&foo=bar2' konvertiert.

(7), dataFilter (Funktion): Eine Funktion, die die von Ajax zurückgegebenen Originaldaten vorverarbeitet. Geben Sie zwei Parameter an: Daten und Typ: Daten sind die von Ajax zurückgegebenen Originaldaten und Typ ist der dataType-Parameter, der beim Aufruf von jQuery.ajax bereitgestellt wird. Der von der Funktion zurückgegebene Wert wird von jQuery weiterverarbeitet.

(8), dataType (String): (Standardwert: XML oder HTML intelligent bestimmen)
Der Datentyp, der voraussichtlich vom Server zurückgegeben wird. Wenn nicht angegeben, gibt jQuery automatisch ResponseXML oder ResponseText basierend auf den MIME-Informationen des HTTP-Pakets zurück und übergibt sie als Callback--Funktionsparameter . Verfügbare Werte:

„xml“: Gibt ein XML-Dokument zurück das kann von jQuery verarbeitet werden.
„html“: Gibt reine Text-HTML-Informationen zurück; das enthaltene Skript-Tag wird ausgeführt, wenn es in den Dom eingefügt wird.
"script": Gibt Nur-Text-JavaScript-Code zurück. Ergebnisse werden nicht automatisch zwischengespeichert. Es sei denn, der Parameter „Cache“ ist gesetzt. Hinweis: Bei Remote-Anfragen (nicht unter derselben Domäne) werden alle POST-Anfragen in GET-Anfragen umgewandelt. (Da zum Laden das DOM-Skript-Tag verwendet wird)
"json": Gibt JSON-Daten zurück.
"jsonp": JSONP-Format. Beim Aufrufen einer Funktion im JSONP-Format, z. B. „myurl?callback=?“, ersetzt jQuery automatisch ? durch den richtigen Funktionsnamen, um die Callback-Funktion auszuführen.
"text": Gibt eine Nur-Text-Zeichenfolge zurück

(9), Fehler (Funktion): (Standard: ermittelt automatisch (XML oder HTML)) Die Aufrufzeit, wenn die Anfrage fehlschlägt. Es gibt drei Parameter: XMLHttpRequest-Objekt, Fehlermeldung und (optional) erfasstes Fehlerobjekt. Wenn ein Fehler auftritt, kann die Fehlermeldung (der zweite Parameter) zusätzlich zu Null auch „timeout“, „error“, „notmodified“ und „parsererror“ lauten. Ajax-Events.

(10), global (Boolean): (Standard: true) Ob globale AJAX-Ereignisse ausgelöst werden sollen. Bei der Einstellung „false“ werden keine globalen AJAX-Ereignisse wie ajaxStart oder ajaxStop ausgelöst, die zur Steuerung verschiedener Ajax-Ereignisse verwendet werden können.

(11), ifModified (Boolean): (Standard: false) Erhalten Sie nur neue Daten, wenn sich die Serverdaten ändern. Verwenden Sie zur Bestimmung die Header-Informationen „Zuletzt geändert“ des HTTP-Pakets.

(12), jsonp (String): Schreiben Sie den Namen der Rückruffunktion in einer JSONP-Anfrage um. Dieser Wert wird verwendet, um den „Callback“-Teil des URL-Parameters in einer GET- oder POST-Anfrage zu ersetzen, z. B. „callback=?“ führt dazu, dass „onJsonPLoad=?“ übergeben wird Der Server.

(13), Passwort (String): Passwort, das zur Beantwortung einer HTTP-Zugriffsauthentifizierungsanfrage verwendet wird

(14), ProcessData (Boolean): (Standard: true) Standardmäßig werden die Daten gesendet wird in ein Objekt (technisch gesehen keine Zeichenfolge) konvertiert, um dem Standardinhaltstyp „application/x-www-form-urlencoded“ zu entsprechen. Legen Sie „false“ fest, wenn Sie DOM-Bauminformationen oder andere Informationen senden möchten, die Sie nicht konvertieren möchten.

(15), scriptCharset (String): Nur wenn der Datentyp während der Anfrage „jsonp“ oder „script“ ist und der Typ „GET“ ist, wird er zum Erzwingen einer Zeichensatzänderung verwendet. Wird normalerweise verwendet, wenn die lokalen und Remote-Inhaltskodierungen unterschiedlich sind.

(16), Erfolg (Funktion): Rückruffunktion, nachdem die Anfrage erfolgreich ist. Parameter: Vom Server zurückgegebene und gemäß dem dataType-Parameter verarbeitete Daten; eine Zeichenfolge, die den Status beschreibt. Ajax-Events.

(17), Timeout (Anzahl): Legen Sie das Anfrage-Timeout (Millisekunden) fest. Diese Einstellung überschreibt die globale Einstellung.

(18), Typ (String): (Standard: „GET“) Anforderungsmethode („POST“ oder „GET“), der Standard ist „GET“. Hinweis: Andere HTTP-Anfragemethoden wie PUT und DELETE können ebenfalls verwendet werden, werden jedoch nur von einigen Browsern unterstützt.

(19), URL (String): (Standard: aktuelle Seitenadresse) Die Adresse zum Senden der Anfrage.

(20), Benutzername (String): Benutzername, der zur Antwort auf eine HTTP-Zugriffsauthentifizierungsanforderung verwendet wird.

(21), xhr (Funktion): Muss ein XMLHttpRequest-Objekt zurückgeben. Der Standardwert ist ActiveXObject unter IE und XMLHttpRequest in anderen Fällen. Wird verwendet, um ein erweitertes XMLHttpRequest-Objekt zu überschreiben oder bereitzustellen. Dieser Parameter war vor jQuery 1.3 nicht verfügbar.

Verwenden Sie die Methode jQuery.ajax(), um Daten abzurufen. Der Code lautet wie folgt:

$.ajax({
 url: "http://www.php.cn", //请求的url地址
 dataType: "json", //返回格式为json
 async: true, //请求是否异步,默认为异步,这也是ajax重要特性
 data: { "id": "value" }, //参数值
 type: "GET", //请求方式
 beforeSend: function() {
  //请求前的处理
 },
 success: function(req) {
  //请求成功时处理
 },
 complete: function() {
  //请求完成的处理
 },
 error: function() {
  //请求出错处理
 }
});
Nach dem Login kopieren

Das obige ist der detaillierte Inhalt vonAusführliche Erklärung zur Implementierung einer Ajax-Anfrage in JQuery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!

Verwandte Etiketten:
Quelle:php.cn
Erklärung dieser Website
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Beliebte Tutorials
Mehr>
Neueste Downloads
Mehr>
Web-Effekte
Quellcode der Website
Website-Materialien
Frontend-Vorlage