ホームページ ウェブフロントエンド jsチュートリアル jqueryでajaxリクエストを実装する方法を詳しく解説

jqueryでajaxリクエストを実装する方法を詳しく解説

Jun 19, 2017 am 09:38 AM
ajax jquery どうやって 成し遂げる 聞く

Ajaxリクエスト

jQuery.ajax(オプション)

HTTPリクエスト経由でリモートデータを読み込みます。 jQuery の基礎となる AJAX 実装。シンプルで使いやすい高レベルの実装については、.get、.post などを参照してください。

.ajax() は、作成した XMLHttpRequest オブジェクトを返します。ほとんどの場合、このオブジェクトを直接操作する必要はありませんが、特殊な場合には、リクエストを手動で終了するために使用できます。 .ajax() にはパラメーターが 1 つだけあります: パラメーター キー/値オブジェクト (各設定と コールバック関数 情報を含む)。以下の詳細なパラメータ オプションを参照してください。

注: dataType オプションを指定する場合は、サーバーが正しい MIME 情報を返すことを確認してください (例: xml は「text/xml」を返します)。 MIME タイプが正しくないと、予期しないエラーが発生する可能性があります。

注: dataType が「script」に設定されている場合、リモートリクエスト中 (同じドメインの下ではない)、すべての POST リクエストは GET リクエストに変換されます。 (DOMスクリプトタグを使用してロードするため)

jQuery 1.2では、ドメインを越えてJSONデータをロードすることができます。それを使用する場合、データ型をJSONPに設定する必要があります。 「myurl?callback=?」などの JSONP 形式を使用して関数を呼び出す場合、jQuery はコールバック関数を実行するために ? を正しい関数名に自動的に置き換えます。データ型が「jsonp」に設定されている場合、jQuery は自動的にコールバック関数を呼び出します。

戻り値 XMLHttpRequest

Parameters

options (オプション): AJAX リクエストの設定。すべてのオプションはオプションです。

オプション

(1)、async (ブール値): (デフォルト: true)
デフォルト設定では、すべてのリクエストは非同期リクエストです。同期リクエストを送信する必要がある場合は、このオプションを false に設定します。同期リクエストはブラウザをロックするため、ユーザーはリクエストが完了するまで他の操作を実行する必要があることに注意してください。

(2) beforeSend (関数): カスタム HTTP ヘッダーの追加など、リクエストを送信する前に XMLHttpRequest オブジェクトを変更できる関数。
XMLHttpRequest オブジェクトが唯一のパラメータです。これは Ajax イベントです。 false が返された場合、この ajax リクエストはキャンセルできます。

(3)、キャッシュ (ブール値): (デフォルト: true、dataType が script の場合、デフォルトは false)
jQuery 1.2 の新機能、false に設定すると、ブラウザーのキャッシュから リクエスト情報 が読み込まれません。

(4)、complete (関数): リクエスト完了後のコールバック関数 (リクエストが成功または失敗したときに呼び出されます)。
パラメータ: XMLHttpRequest オブジェクトと成功したリクエストの種類を説明する文字列。 これは Ajax イベントです

(5)、contentType (String): (デフォルト: "application/x-www-form-urlencoded") サーバーに情報を送信するときのコンテンツ エンコード タイプ。デフォルト値はほとんどのアプリケーションに適しています。

(6)、データ (オブジェクト、文字列): サーバーに送信されるデータ。リクエスト文字列形式に自動的に変換されます。 GET リクエストの URL に追加されます。この自動変換を無効にするには、processData オプションの説明を参照してください。
キー/値形式である必要があります。配列の場合、jQuery は異なる値に同じ名前を自動的に割り当てます。たとえば、{foo:["bar1", "bar2"]} は '&foo=bar1&foo=bar2' に変換されます。

(7)、dataFilter (関数): Ajax から返された元のデータを前処理する関数。 data と type の 2 つのパラメータを指定します。data は Ajax によって返される元のデータで、type は jQuery.ajax を呼び出すときに提供される dataType パラメータです。関数によって返された値は、jQuery によってさらに処理されます。

(8)、dataType (String): (デフォルト値: xml または html をインテリジェントに決定)
サーバーによって返されることが予期されるデータ型。指定しない場合、jQuery は HTTP パケットの MIME 情報に基づいて responseXML または responseText を自動的に返し、それをコールバック 関数パラメーター として渡します。 使用可能な値:

"xml": jQuery で処理できる XML ドキュメントを返します。
"html": プレーンテキストの HTML 情報を返します。含まれているスクリプト タグは、DOM に挿入されると実行されます。
"script": プレーンテキストの JavaScript コードを返します。結果は自動的にキャッシュされません。 「キャッシュ」パラメータが設定されていない限り。注: リモート要求 (同じドメインの下ではない) を行う場合、すべての POST 要求は GET 要求に変換されます。 (読み込みにDOMスクリプトタグを使用するため)
"json": JSONデータを返します。
「jsonp」: JSONP形式。 「myurl?callback=?」などの JSONP 形式を使用して関数を呼び出す場合、jQuery はコールバック関数を実行するために ? を正しい関数名に自動的に置き換えます。
"text": プレーンテキスト文字列を返します

(9)、error(関数): (デフォルト:自動判定(xml or html)) リクエストが失敗した場合に呼び出すタイミング。 XMLHttpRequest オブジェクト、エラー メッセージ、および (オプション) キャプチャされたエラー オブジェクトの 3 つのパラメーターがあります。エラーが発生した場合、エラー メッセージ (2 番目のパラメーター) には、null に加えて、「timeout」、「error」、「notmodified」、および「parsererror」が含まれる場合があります。アヤックスのイベント。

(10)、グローバル (ブール値): (デフォルト: true) グローバル AJAX イベントをトリガーするかどうか。 false に設定すると、さまざまな Ajax イベントの制御に使用できる ajaxStart や ajaxStop などのグローバル AJAX イベントはトリガーされません。

(11)、ifModified (ブール値): (デフォルト: false) サーバーのデータが変更された場合にのみ新しいデータを取得します。 HTTP パケットの Last-Modified ヘッダー情報を使用して決定します。

(12), jsonp (String): jsonp リクエスト内のコールバック関数の名前を書き換えます。この値は、「callback=?」などの GET または POST リクエストの URL パラメーターの「callback」部分を置換するために使用されます。たとえば、{jsonp:'onJsonPLoad'} は「onJsonPLoad=?」に渡されます。サーバー。

(13)、password (文字列): HTTP アクセス認証リクエストに応答するために使用されるパスワード

(14)、processData (Boolean): (デフォルト: true) デフォルトでは、送信されたデータはオブジェクト (テクノロジー) に変換されます。 (文字列ではなく) デフォルトのコンテンツ タイプ「application/x-www-form-urlencoded」と一致します。 DOM ツリー情報または変換したくないその他の情報を送信する場合は、false に設定します。

(15)、scriptCharset (String): リクエスト中の dataType が「jsonp」または「script」で、タイプが「GET」の場合にのみ、文字セットの変更を強制するために使用されます。通常、ローカルとリモートのコンテンツのエンコーディングが異なる場合に使用されます。

(16)、success (関数): リクエストが成功した後のコールバック関数。パラメータ: サーバーから返され、dataType パラメータに従って処理されたデータ。ステータスを説明する文字列。アヤックスのイベント。

(17)、タイムアウト (数値): リクエストのタイムアウト (ミリ秒) を設定します。この設定はグローバル設定をオーバーライドします。

(18)、タイプ (文字列): (デフォルト: "GET") リクエストメソッド ("POST" または "GET")、デフォルトは "GET" です。注: PUT や DELETE などの他の HTTP リクエスト メソッド も使用できますが、一部のブラウザーでのみサポートされています。

(19)、url (文字列): (デフォルト: 現在のページのアドレス) リクエストを送信するアドレス。

(20)、username (文字列): HTTP アクセス認証リクエストに応答するために使用されるユーザー名

(21)、xhr (関数): XMLHttpRequest オブジェクトを返す必要があります。デフォルトは、IE では ActiveXObject、その他の場合は XMLHttpRequest です。拡張された XMLHttpRequest オブジェクトをオーバーライドまたは提供するために使用されます。このパラメーターは、jQuery 1.3 より前では使用できませんでした。

jQuery.ajax() メソッドを使用してデータを取得します。コードは次のとおりです:

$.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() {
  //请求出错处理
 }
});
ログイン後にコピー

以上がjqueryでajaxリクエストを実装する方法を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Huawei 携帯電話にデュアル WeChat ログインを実装するにはどうすればよいですか? Huawei 携帯電話にデュアル WeChat ログインを実装するにはどうすればよいですか? Mar 24, 2024 am 11:27 AM

Huawei 携帯電話にデュアル WeChat ログインを実装するにはどうすればよいですか?ソーシャルメディアの台頭により、WeChatは人々の日常生活に欠かせないコミュニケーションツールの1つになりました。ただし、多くの人は、同じ携帯電話で同時に複数の WeChat アカウントにログインするという問題に遭遇する可能性があります。 Huawei 社の携帯電話ユーザーにとって、WeChat の二重ログインを実現することは難しくありませんが、この記事では Huawei 社の携帯電話で WeChat の二重ログインを実現する方法を紹介します。まず第一に、ファーウェイの携帯電話に付属するEMUIシステムは、デュアルアプリケーションを開くという非常に便利な機能を提供します。アプリケーションのデュアルオープン機能により、ユーザーは同時に

PHP プログラミング ガイド: フィボナッチ数列を実装する方法 PHP プログラミング ガイド: フィボナッチ数列を実装する方法 Mar 20, 2024 pm 04:54 PM

プログラミング言語 PHP は、さまざまなプログラミング ロジックやアルゴリズムをサポートできる、Web 開発用の強力なツールです。その中でも、フィボナッチ数列の実装は、一般的で古典的なプログラミングの問題です。この記事では、PHP プログラミング言語を使用してフィボナッチ数列を実装する方法を、具体的なコード例を添付して紹介します。フィボナッチ数列は、次のように定義される数学的数列です。数列の最初と 2 番目の要素は 1 で、3 番目の要素以降、各要素の値は前の 2 つの要素の合計に等しくなります。シーケンスの最初のいくつかの要素

Huawei携帯電話にWeChatクローン機能を実装する方法 Huawei携帯電話にWeChatクローン機能を実装する方法 Mar 24, 2024 pm 06:03 PM

Huawei 携帯電話に WeChat クローン機能を実装する方法 ソーシャル ソフトウェアの人気と人々のプライバシーとセキュリティの重視に伴い、WeChat クローン機能は徐々に人々の注目を集めるようになりました。 WeChat クローン機能を使用すると、ユーザーは同じ携帯電話で複数の WeChat アカウントに同時にログインできるため、管理と使用が容易になります。 Huawei携帯電話にWeChatクローン機能を実装するのは難しくなく、次の手順に従うだけです。ステップ 1: 携帯電話システムのバージョンと WeChat のバージョンが要件を満たしていることを確認する まず、Huawei 携帯電話システムのバージョンと WeChat アプリが最新バージョンに更新されていることを確認します。

Golang がゲーム開発の可能性を可能にする方法をマスターする Golang がゲーム開発の可能性を可能にする方法をマスターする Mar 16, 2024 pm 12:57 PM

今日のソフトウェア開発分野では、効率的で簡潔かつ同時実行性の高いプログラミング言語として、Golang (Go 言語) が開発者にますます好まれています。豊富な標準ライブラリと効率的な同時実行機能により、ゲーム開発の分野で注目を集めています。この記事では、ゲーム開発に Golang を使用する方法を検討し、具体的なコード例を通じてその強力な可能性を示します。 1. ゲーム開発における Golang の利点 Golang は静的型付け言語として、大規模なゲーム システムの構築に使用されます。

PHP ゲーム要件実装ガイド PHP ゲーム要件実装ガイド Mar 11, 2024 am 08:45 AM

PHP ゲーム要件実装ガイド インターネットの普及と発展に伴い、Web ゲーム市場の人気はますます高まっています。多くの開発者は、PHP 言語を使用して独自の Web ゲームを開発することを望んでおり、ゲーム要件の実装は重要なステップです。この記事では、PHP 言語を使用して一般的なゲーム要件を実装する方法を紹介し、具体的なコード例を示します。 1. ゲームキャラクターの作成 Web ゲームにおいて、ゲームキャラクターは非常に重要な要素です。ゲームキャラクターの名前、レベル、経験値などの属性を定義し、これらを操作するメソッドを提供する必要があります。

PHP と Ajax: オートコンプリート提案エンジンの構築 PHP と Ajax: オートコンプリート提案エンジンの構築 Jun 02, 2024 pm 08:39 PM

PHP と Ajax を使用してオートコンプリート候補エンジンを構築します。 サーバー側スクリプト: Ajax リクエストを処理し、候補を返します (autocomplete.php)。クライアント スクリプト: Ajax リクエストを送信し、提案を表示します (autocomplete.js)。実際のケース: HTML ページにスクリプトを組み込み、検索入力要素の識別子を指定します。

Ajaxを使用してPHPメソッドから変数を取得するにはどうすればよいですか? Ajaxを使用してPHPメソッドから変数を取得するにはどうすればよいですか? Mar 09, 2024 pm 05:36 PM

Ajax を使用して PHP メソッドから変数を取得することは、Web 開発では一般的なシナリオであり、Ajax を使用すると、データを更新せずにページを動的に取得できます。この記事では、Ajax を使用して PHP メソッドから変数を取得する方法と、具体的なコード例を紹介します。まず、Ajax リクエストを処理し、必要な変数を返すための PHP ファイルを作成する必要があります。以下は、単純な PHP ファイル getData.php のサンプル コードです。

PHP と Ajax: 動的に読み込まれるコンテンツを作成するためのソリューション PHP と Ajax: 動的に読み込まれるコンテンツを作成するためのソリューション Jun 06, 2024 pm 01:12 PM

Ajax (非同期 JavaScript および XML) を使用すると、ページをリロードせずに動的コンテンツを追加できます。 PHP と Ajax を使用すると、製品リストを動的にロードできます。HTML はコンテナ要素を含むページを作成し、Ajax リクエストはロード後に要素にデータを追加します。 JavaScript は Ajax を使用して XMLHttpRequest を通じてサーバーにリクエストを送信し、サーバーから JSON 形式で商品データを取得します。 PHP は MySQL を使用してデータベースから製品データをクエリし、それを JSON 形式にエンコードします。 JavaScript は JSON データを解析し、ページ コンテナーに表示します。ボタンをクリックすると、製品リストをロードするための Ajax リクエストがトリガーされます。

See all articles