ホームページ > ウェブフロントエンド > jsチュートリアル > jquery ajaxメソッドと各パラメータの使い方を詳しく紹介

jquery ajaxメソッドと各パラメータの使い方を詳しく紹介

高洛峰
リリース: 2017-03-19 11:57:48
オリジナル
1223 人が閲覧しました

jquery ajaxメソッドと各パラメータの詳細な説明

1.$.ajax()にはパラメータkey/valueobjectが1つだけあり、各設定とコールバック関数の情報が含まれます。

パラメータリスト:

パラメータ名 Type Description
url String (デフォルト: 現在のページアドレス) リクエストを送信するアドレス。
type String (デフォルト: "GET") リクエストメソッド ("POST" または "GET")、デフォルトは "GET" です。注: PUT や DELETE などの他の HTTP リクエスト メソッドも使用できますが、一部のブラウザでのみサポートされています。
timeout Number リクエストのタイムアウト(ミリ秒)を設定します。この設定はグローバル設定をオーバーライドします。
async Boolean (デフォルト: true) デフォルトでは、すべてのリクエストは非同期リクエストです。同期リクエストを送信する必要がある場合は、このオプションを false に設定します。同期リクエストはブラウザをロックするため、ユーザーはリクエストが完了するまで他の操作を実行する必要があることに注意してください。
beforeSend Function カスタムHTTPヘッダーの追加など、リクエストを送信する前にXMLHttpRequestオブジェクトの関数を変更できます。 XMLHttpRequest オブジェクトが唯一のパラメータです。
function (XMLHttpRequest) {

         this; // the options for this ajax request
         }
ログイン後にコピー
ログイン後にコピー
cache Boolean (デフォルト: true) jQuery 1.2の新機能、falseに設定するとブラウザキャッシュからリクエスト情報をロードしません。
complete Function リクエスト完了後のコールバック関数(リクエストが成功または失敗したときに呼び出されます)。パラメーター: XMLHttpRequest オブジェクト、成功情報 文字列
function (XMLHttpRequest, textStatus) {

         this; // the options for this ajax request
         }
ログイン後にコピー
ログイン後にコピー
contentType String

(デフォルト: "application/x-www-form-urlencoded") サーバーに情報を送信するときのコンテンツのエンコードタイプ。デフォルト値はほとんどのアプリケーションに適しています。ブラウザから送信されたデータの形式をサーバーに伝えます。

例: データを送信するときに JSON2.js のメソッド JSON.stringify(obj) を使用した場合、データを json 文字列にフォーマットした後、デフォルトでデータを送信するときにエラーが報告されます。このとき、送信するコンテンツの形式を「application/json」として指定する必要があります。

data Object,
String

サーバーに送信されたデータ。

dataデータ型JavaScriptオブジェクトまたはarrayの場合、Jqueryは自動的にJQuery.param()メソッドを呼び出して、送信されるデータを「application/x-www-form-urlencoded」形式にエンコードします。データ (つまり、name=value&name1=value1); JavaScript オブジェクトが配列である場合、jQuery は自動的に異なる値に同じ名前を対応させます。たとえば、{foo:["bar1", "bar2"]} は '&foo=bar1&foo=bar2' に変換されます。

データのデータ型が String 型の場合は、次のように処理されたデータが直接デフォルトになります。 「application/x-www-form-urlencoded」形式のエンコードが完了し、変換されなくなりました。

processData オプションは、変換を実行するかどうかを制御できます。このオプションのデフォルトは true です。

dataType String

预期服务器返回的数据类型。设定HttpHeader中“Accept”域的内容,告诉服务器浏览器可以想要返回的数据格式类型,同时JQuery也会根据该类型对返回的数据进行处理。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息返回 responseXML 或 responseText,并作为回调函数参数传递,可用值:

"xml": 返回 XML 文档,可用 jQuery 处理。

"html": 返回纯文本 HTML 信息;包含 script 元素。

"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。

"json": 返回 JSON 数据 。JQuery将返回的字符串格式数据自动转化为Javascript对象,便于直接使用obj.property格式访问。若没有指定该选项,即使返回的是JSON格式的字符串,JQuery也不会自动转换。

"jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。

error Function (默认: 自动判断 (xml 或 html)) 请求失败时将调用此方法。这个方法有三个参数:XMLHttpRequest 对象,错误信息,(可能)捕获的错误对象。
function (XMLHttpRequest, textStatus, errorThrown) {

         // 通常情况下textStatus和errorThown只有其中一个有值 
         this; // the options for this ajax request
         }
ログイン後にコピー
ログイン後にコピー
global Boolean (默认: true) 是否触发全局 AJAX 事件。设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 。可用于控制不同的Ajax事件
ifModified Boolean (默认: false) 仅在服务器数据改变时获取新数据。使用 HTTP 包 Last-Modified 头信息判断。
processData Boolean (默认: true) 默认情况下,发送的数据将被转换为对象(技术上讲并非字符串) 以配合默认内容类型 "application/x-www-form-urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息,请设置为 false。
success Function 请求成功后回调函数。这个方法有两个参数:服务器返回数据,返回状态
function (data, textStatus) {

         // data could be xmlDoc, jsonObj, html, text, etc...
         this; // the options for this ajax request
         }
ログイン後にコピー
ログイン後にコピー

2. jQuery.get(url, [data], [callback], [type]): GET メソッドを使用して非同期リクエストを作成します。

パラメータ:
url (文字列): リクエストを送信する URL アドレス。 data (
Map): (オプション) サーバーに送信されるデータ。キーと値のペアの形式で表されます。 callback (関数): (オプション) ロードが成功したときのコールバック関数 (このメソッドは、Response の戻りステータスが成功の場合にのみ呼び出されます)。
type (文字列): (オプション) 公式の説明は次のとおりです: 送信されるデータのタイプ。実際には、クライアントリクエストのタイプ (JSON、XML など) である必要があります

3. jQuery.post( url, [data], [callback], [type] ): POST メソッドを使用して非同期にしますrequest

パラメータ:

url (文字列): リクエストを送信する URL アドレス
data (マップ): (オプション) キーと値のペアの形式で表される、サーバーに送信されるデータ。
callback (関数): (オプション) ロードが成功したときのコールバック関数 (このメソッドは、Response の戻りステータスが成功の場合にのみ呼び出されます)。
type (文字列): (オプション) 公式の説明は次のとおりです: 送信されるデータのタイプ。実際には、クライアントによって要求されたタイプ (JSON、XML など) である必要があります。

1.$.ajax() にはパラメーターが 1 つだけあります: パラメーター キー/値オブジェクト (各設定とコールバック関数の情報を含む)。

パラメータリスト:

パラメータ名TypeDescriptionString (デフォルト: 現在のページアドレス) リクエストを送信するアドレス。 String (デフォルト: "GET") リクエストメソッド ("POST" または "GET")、デフォルトは "GET" です。注: PUT や DELETE などの他の HTTP リクエスト メソッドも使用できますが、一部のブラウザでのみサポートされます。 Numberリクエストのタイムアウト(ミリ秒)を設定します。この設定はグローバル設定をオーバーライドします。 Boolean(デフォルト: true) デフォルトでは、すべてのリクエストは非同期リクエストです。同期リクエストを送信する必要がある場合は、このオプションを false に設定します。同期リクエストはブラウザをロックするため、ユーザーはリクエストが完了するまで他の操作を実行する必要があることに注意してください。 Functionカスタム HTTP ヘッダーの追加など、リクエストを送信する前に XMLHttpRequest オブジェクトの関数を変更できます。 XMLHttpRequest オブジェクトが唯一のパラメータです。 Boolean(デフォルト: true) jQuery 1.2 の新機能、false に設定すると、ブラウザーのキャッシュからリクエスト情報がロードされません。 Functionリクエスト完了後のコールバック関数(リクエストが成功または失敗したときに呼び出されます)。パラメータ: XMLHttpRequest オブジェクト、成功情報文字列。 StringObject,
url
type
timeout
async
beforeSend
function (XMLHttpRequest) {

         this; // the options for this ajax request
         }
ログイン後にコピー
ログイン後にコピー

cache
complete
function (XMLHttpRequest, textStatus) {

         this; // the options for this ajax request
         }
ログイン後にコピー
ログイン後にコピー

contentType (デフォルト: "application/x-www-form-urlencoded") サーバーに情報を送信するときのコンテンツのエンコードタイプ。デフォルト値はほとんどのアプリケーションに適しています。ブラウザから送信されたデータの形式をサーバーに伝えます。

例: データを送信するときに JSON2.js のメソッド JSON.stringify(obj) を使用し、それを json 文字列にフォーマットした後、データを送信するときにデフォルトでエラーが報告されます。このとき、送信するコンテンツの形式を「application/json」として指定する必要があります。

data String
サーバーに送信されたデータ。

データのデータ型が JavaScript オブジェクトまたは配列の場合、Jquery は送信する前に自動的に JQuery.param() メソッドを呼び出し、送信されるデータを「application/x-www-form-urlencoded」形式のデータ (つまり、名前) にエンコードします。 =value&name1 =value1); JavaScript オブジェクトは Key/Value 形式である必要があります。配列の場合、jQuery は異なる値に対して自動的に同じ名前に対応します。たとえば、{foo:["bar1", "bar2"]} は '&foo=bar1&foo=bar2' に変換されます。

データのデータ型が String 型の場合は、次のように処理されたデータが直接デフォルトになります。 「application/x-www-form-urlencoded」形式のエンコードが完了し、変換されなくなりました。

processData オプションは、変換を実行するかどうかを制御できます。このオプションのデフォルトは true です。

dataType String

预期服务器返回的数据类型。设定HttpHeader中“Accept”域的内容,告诉服务器浏览器可以想要返回的数据格式类型,同时JQuery也会根据该类型对返回的数据进行处理。如果不指定,jQuery 将自动根据 HTTP 包 MIME 信息返回 responseXML 或 responseText,并作为回调函数参数传递,可用值:

"xml": 返回 XML 文档,可用 jQuery 处理。

"html": 返回纯文本 HTML 信息;包含 script 元素。

"script": 返回纯文本 JavaScript 代码。不会自动缓存结果。

"json": 返回 JSON 数据 。JQuery将返回的字符串格式数据自动转化为Javascript对象,便于直接使用obj.property格式访问。若没有指定该选项,即使返回的是JSON格式的字符串,JQuery也不会自动转换。

"jsonp": JSONP 格式。使用 JSONP 形式调用函数时,如 "myurl?callback=?" jQuery 将自动替换 ? 为正确的函数名,以执行回调函数。

error Function (默认: 自动判断 (xml 或 html)) 请求失败时将调用此方法。这个方法有三个参数:XMLHttpRequest 对象,错误信息,(可能)捕获的错误对象。
function (XMLHttpRequest, textStatus, errorThrown) {

         // 通常情况下textStatus和errorThown只有其中一个有值 
         this; // the options for this ajax request
         }
ログイン後にコピー
ログイン後にコピー
global Boolean (默认: true) 是否触发全局 AJAX 事件。设置为 false 将不会触发全局 AJAX 事件,如 ajaxStart 或 ajaxStop 。可用于控制不同的Ajax事件
ifModified Boolean (默认: false) 仅在服务器数据改变时获取新数据。使用 HTTP 包 Last-Modified 头信息判断。
processData Boolean (默认: true) 默认情况下,发送的数据将被转换为对象(技术上讲并非字符串) 以配合默认内容类型 "application/x-www-form-urlencoded"。如果要发送 DOM 树信息或其它不希望转换的信息,请设置为 false。
success Function 请求成功后回调函数。这个方法有两个参数:服务器返回数据,返回状态
function (data, textStatus) {

         // data could be xmlDoc, jsonObj, html, text, etc...
         this; // the options for this ajax request
         }
ログイン後にコピー
ログイン後にコピー

2. jQuery.get(url, [data], [callback], [type]):使用GET方式来进行异步请求.

参数:
url (String) : 发送请求的URL地址.
data (Map) : (可选) 要发送给服务器的数据,以 Key/value 的键值对形式表示。
callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法)。
type (String) : (可选)官方的说明是:Type of data to be sent。其实应该为客户端请求的类型(JSON,XML,等等)

3. jQuery.post( url, [data], [callback], [type] ) :使用POST方式来进行异步请求

参数:
url (String) : 发送请求的URL地址.
data (Map) : (可选) 要发送给服务器的数据,以 Key/value 的键值对形式表示。
callback (Function) : (可选) 载入成功时回调函数(只有当Response的返回状态是success才是调用该方法)。
type (String) : (可选)官方的说明是:Type of data to be sent。其实应该为客户端请求的类型(JSON,XML,等等)

以上がjquery ajaxメソッドと各パラメータの使い方を詳しく紹介の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

関連ラベル:
ソース:php.cn
このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。
最新の問題
人気のチュートリアル
詳細>
最新のダウンロード
詳細>
ウェブエフェクト
公式サイト
サイト素材
フロントエンドテンプレート