Ausführliche Erläuterung der Beispiele für die Verwendung der jQuery.ajax()-Funktion in jquery

Die Funktion

jQuery.ajax() ist die Implementierung der von jQuery gekapselten AJAX-Technologie. Mit dieser Funktion können wir Daten auf dem Remote-Server abrufen, ohne die aktuelle Seite zu aktualisieren. wird verwendet, um Remote-Daten über Hintergrund-HTTP-Anfragen zu laden.

Die Funktion jQuery.ajax() ist die zugrunde liegende AJAX-Implementierung von jQuery. jQuery.get(), jQuery.post(), load(), jQuery.getJSON(), jQuery.getScript() und andere Funktionen sind alle vereinfachte Formen dieser Funktion (sie rufen alle diese Funktion auf, aber die Parametereinstellungen sind unterschiedlich oder weggelassen haben).

Diese Funktion gehört zum globalen jQuery-Objekt (kann auch als statische Funktion verstanden werden).

Syntax

jQuery 1.0 hat diese statische Funktion hinzugefügt. Die Funktion jQuery.ajax() hat die folgenden zwei Verwendungen:

Verwendung eins:

jQuery.ajax( [ settings ] ] )

Verwendung zwei: jQuery 1.5 unterstützt diese Verwendung neu.

jQuery.ajax( url [, settings ] ] )

Nutzung 2 ist eine Variante der Nutzung 1. Sie extrahiert lediglich die optionale Attribut-URL in den Parameterobjekteinstellungen als unabhängigen Parameter.

Parameter

Bitte suchen Sie den entsprechenden Parameter entsprechend dem im vorherigen Syntaxabschnitt definierten Parameternamen.

url String-Typ URL-Anfrage String.

Einstellungen Optional/Objektklasse ist ein Objektobjekt , dessen jede Eigenschaft verwendet wird, um zusätzliche Parametereinstellungen anzugeben, die zum Senden der Anfrage erforderlich sind. Die Parametereinstellungen sind ein Objekt.

Rückgabewert

jQuery.ajax()Der Rückgabewert der Funktion ist vom Typ jqXHR und gibt das jqXHR-Objekt des zurück aktuelle Anfrage ( jQuery 1.4 und frühere Versionen geben das native XMLHttpRequest-Objekt zurück).

Beispielcodebeschreibung:

Wenn für jQuery.ajax() keine Parameter angegeben sind, lautet die Standardanforderung die aktuelle Seite und die zurückgegebenen Daten werden nicht verarbeitet.

Im Einstellungsobjekt der jQuery.ajax()-Funktion sind häufig verwendete Attribute: URL, Typ, asynchron, Daten, Datentyp, Erfolg, Fehler, abgeschlossen, beforeSend, Zeitüberschreitung usw.

Bitte beachten Sie den folgenden anfänglichen HTML-Code:

<div id="content"></div>

Das Folgende ist der jQuery-Beispielcode für die Funktion jQuery.ajax(), um die spezifische Verwendung von jQuery.ajax zu demonstrieren () Funktion:

$.ajax({
     url: "jquery_ajax.php"
    , type: "POST"
    , data: "name=codeplayer&age=18"
    , success: function( data, textStatus, jqXHR ){
        // data 是返回的数据
        // textStatus 可能为"success"、"notmodified"等
        // jqXHR 是经过jQuery封装的XMLHttpRequest对象
        alert("返回的数据" + data);
    }
});

$.ajax({
     url: "jquery_ajax.php?page=1&id=3"
    , type: "POST"
    // jQuery会自动将对象数据转换为 "name=codeplayer&age=18&uid=1&uid=2&uid=3"
    , data: { name:"codeplayer", age:18, uid: [1, 2, 3] }
    // 请求成功时执行
    , success: function( data, textStatus, jqXHR ){
        alert("返回的数据" + data);
    }
    // 请求失败时执行
    , error: function(jqXHR, textStatus, errorMsg){
        // jqXHR 是经过jQuery封装的XMLHttpRequest对象
        // textStatus 可能为： null、"timeout"、"error"、"abort"或"parsererror"
        // errorMsg 可能为： "Not Found"、"Internal Server Error"等
        alert("请求失败：" + errorMsg);
    }
});

// 将url单独提取出来作为第一个参数(jQuery 1.5+才支持)
$.ajax("jquery_ajax.php?action=type&id=3", {
     dataType: "json" // 返回JSON格式的数据
    , success: function( data, textStatus, jqXHR ){
        // 假设返回的字符串数据为{ "name": "CodePlayer", age: 20 }
        // jQuery已帮我们将该JSON字符串转换为对应的JS对象，可以直接使用
        alert( data.name ); // CodePlayer
    }   
});

$.ajax( {
    // 注意这里有个参数callback=?
     url: "http://cross-domain/jquery_ajax.php?name=Jim&callback=?&age=21"
    , async: false // 同步请求，发送请求后浏览器将被锁定，只有等到该请求完成(无论成功或失败)后，用户才能操作，js代码才会继续执行
    , dataType: "jsonp" // 返回JSON格式的数据
    , success: function( data, textStatus, jqXHR ){
        // 假设返回的字符串数据为{ "site_name": "CodePlayer", "site_desc": "专注于编程开发技术分享" }
        // jQuery已帮我们将该JSON字符串转换为对应的JS对象，可以直接使用
        alert( data.site_desc ); // 专注于编程开发技术分享
    }   
});

$.ajax( {
    // 加载指定的js文件到当前文档中
     url: "http://code.jquery.com/jquery-1.8.3.min.js"
    , dataType: "script"
});

Das obige ist der detaillierte Inhalt vonAusführliche Erläuterung der Beispiele für die Verwendung der jQuery.ajax()-Funktion in jquery. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!