ホームページ > 記事 > ウェブフロントエンド > ajaxの用途は何ですか? ajaxの具体的な使い方を詳しく解説
この記事では、誰でも記事の内容をより早く理解できるように、主に ajax の使用方法の詳細を説明し、それを証明する例を示します。それではこの記事を見てみましょう
構文: $.ajax([settings]);
$.ajax({ type: "POST", url: "UserLogincheck", data: {username:$("#username").val(), password:$("#password").val(),verify:$("#verify").val()}, dataType: "json", success: function(data){ if(data==1){ // 用户名或密码错误 alert("用户名或密码错误"); } else if(data==2){ alert("验证码错误"); // 验证码错误 } else if(data==0){ window.location.href="index"; } //跳转页面 }, error:function(XMLHttpRequest, textStatus, errorThrown){//请求失败时调用此函数 console.log(XMLHttpRequest.status); console.log(XMLHttpRequest.readyState); console.log(textStatus); } });
ajaxパラメータの詳細:
data
Type: String サーバーに送信されたデータ。リクエスト文字列形式に自動的に変換されます。 GET リクエストの URL に追加されます。この自動変換を無効にするには、processData オプションの説明を参照してください。キー/値形式である必要があります。配列の場合、jQuery は異なる値に同じ名前を自動的に割り当てます。たとえば、{foo:["bar1", "bar2"]} は '&foo=bar1&foo=bar2' に変換されます。 (さらに詳しく知りたい場合は、PHP 中国語 Web サイトAJAX 開発マニュアル
の列にアクセスして学習してください)dataFilter
タイプ: 関数
Ajax から返された元のデータを前処理するための関数。 data と type の 2 つのパラメータを指定します。data は Ajax によって返される元のデータで、type は jQuery.ajax を呼び出すときに提供される dataType パラメータです。関数によって返された値は、jQuery によってさらに処理されます。
dataTypeType: Stringサーバーから返される予期されるデータ型。指定しない場合、jQuery は HTTP パッケージの MIME 情報に基づいて自動的にインテリジェントな判断を行います。たとえば、XML の MIME タイプは XML として認識されます。 1.4 では、JSON が JavaScript オブジェクトを生成し、script がスクリプトを実行します。サーバーから返されたデータは、この値に基づいて解析され、コールバック関数に渡されます。使用可能な値: "xml": jQuery で処理できる XML ドキュメントを返します。
"html": プレーンテキストの HTML 情報を返します。含まれているスクリプト タグは、DOM に挿入されると実行されます。 "script": プレーンテキストの JavaScript コードを返します。結果は自動的にキャッシュされません。 「キャッシュ」パラメータが設定されていない限り。注: リモート要求 (同じドメインの下ではない) を行う場合、すべての POST 要求は GET 要求に変換されます。 (読み込みにDOMスクリプトタグを使用するため)
"json": JSONデータを返します。
「jsonp」: JSONP形式。 「myurl?callback=?」などの JSONP 形式を使用して関数を呼び出す場合、jQuery はコールバック関数を実行するために ? を正しい関数名に自動的に置き換えます。
"text": 平文の文字列を返す
error種類: 関数
デフォルト値: 自動判定(xmlまたはhtml)この関数は、リクエストが失敗したときに呼び出されます。
には、XMLHttpRequest オブジェクト、エラー メッセージ、および (オプション) キャプチャされた例外オブジェクトの 3 つのパラメータがあります。
エラーが発生した場合、null を取得するだけでなく、エラー メッセージ (2 番目のパラメーター) が「timeout」、「error」、「notmodified」、「parsererror」になる場合もあります。
これは Ajax イベントです。
globalType: Booleanグローバル AJAX イベントをトリガーするかどうか。デフォルト値: true。 false に設定すると、さまざまな Ajax イベントの制御に使用できる ajaxStart や ajaxStop などのグローバル AJAX イベントはトリガーされません。
ifModifiedType: Boolean
サーバーデータが変更された場合にのみ新しいデータを取得します。デフォルト値: false。 HTTP パケットの Last-Modified ヘッダー情報を使用して決定します。 jQuery 1.4 では、サーバー指定の「etag」もチェックして、データが変更されていないことを確認します。
jsonpType: String
jsonp リクエスト内のコールバック関数の名前をオーバーライドします。この値は、{jsonp:'onJsonPLoad'} などの GET または POST リクエストの URL パラメーターの「コールバック」部分を置き換えるために使用され、「onJsonPLoad=?」がサーバーに渡されます。
jsonpCallback
Type: String
jsonpリクエストのコールバック関数名を指定します。この値は、jQuery によって自動的に生成されるランダムな関数名の代わりに使用されます。これは主に、jQuery が一意の関数名を生成できるようにして、リクエストの管理やコールバック関数とエラー処理の提供を容易にするために使用されます。ブラウザで GET リクエストをキャッシュする場合は、このコールバック関数名を指定することもできます。
password
タイプ: String
HTTP アクセス認証リクエストに応答するために使用されるパスワード
processData
タイプ: Boolean
デフォルト値: true。デフォルトでは、data オプションを通じて渡されたデータは、それがオブジェクトである場合 (技術的に言えば、文字列でない限り)、デフォルトのコンテンツ タイプ「application/x」に一致するように処理され、クエリ文字列に変換されます。 -www-form-urlencoded" "。 DOM ツリー情報または変換したくないその他の情報を送信する場合は、false に設定します。
scriptCharset
Type: String
リクエスト時の dataType が「jsonp」または「script」で、タイプが「GET」の場合にのみ、文字セットの強制変更に使用されます。通常、ローカルとリモートのコンテンツのエンコーディングが異なる場合にのみ使用されます。
success
Type: Function
リクエストが成功した後のコールバック関数。
パラメータ: サーバーから返され、dataType パラメータに従って処理されたデータ。ステータスを説明する文字列。
これは Ajax イベントです。
traditional
型: Boolean
従来の方法でデータをシリアル化する場合は、true に設定します。 「ツール」カテゴリの「jQuery.param」メソッドを参照してください。
timeout
Type: Number
リクエストのタイムアウト (ミリ秒) を設定します。この設定はグローバル設定をオーバーライドします。
type
タイプ: String
デフォルト値: "GET")。リクエストメソッド (「POST」または「GET」)、デフォルトは「GET」です。注: PUT や DELETE などの他の HTTP リクエスト メソッドも使用できますが、一部のブラウザでのみサポートされます。
url
タイプ: String
デフォルト値: 現在のページのアドレス。リクエストの送信先のアドレス。
username
Type: String
HTTP アクセス認証リクエストに応答するために使用されるユーザー名。
xhr
Type: Function
XMLHttpRequest オブジェクトを返す必要があります。デフォルトは、IE の場合は ActiveXObject、それ以外の場合は XMLHttpRequest です。拡張された XMLHttpRequest オブジェクトをオーバーライドまたは提供するために使用されます。このパラメーターは、jQuery 1.3 より前では使用できませんでした。
この記事はここで終わります (さらに詳しく知りたい場合は、PHP 中国語 Web サイトAJAX ユーザーマニュアル の列にアクセスして学習してください)。ご質問がある場合は、以下にメッセージを残してください。
以上がajaxの用途は何ですか? ajaxの具体的な使い方を詳しく解説の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。