JQueryでのajaxカプセル化の説明-jsチュートリアル-php.cn

JQueryでのajaxカプセル化の説明

巴扎黑

リリース： 2017-07-23 14:51:09

オリジナル

1172 人が閲覧しました

ページ上の一部の効果や検証などでは、JavaScript 言語を使用して完成させますが、これは最も基本的なフロントエンド言語である Java コードにも似ており、jQuery は js コードをカプセル化し、簡単に実行できます。フロントエンドコードの作成に役立ちます。また、ブラウザの互換性の問題を解決する上で非常に大きな利点があります。これが、フロントエンドコードを使用することが非常に重要である理由の 1 つです。

現在、ユーザーのニーズを満たすために、Ajax (非同期 JavaScript + XML) 非同期リフレッシュは比類のない役割を果たしています。これまで、Ajax 操作を記述するには、常に JDBC コードのようないくつかの必要な手順を実行する必要がありました。AJAX— —コア。 XMLHttpRequest オブジェクト、および jQuery も Ajax 非同期操作をカプセル化します。次に、一般的に使用されるメソッドをいくつか示します。

$.ajax、$.post、$.get、$.getJSON。

1. $.ajax、これは jquery が ajax をカプセル化するための最も基本的なステップです。この関数を使用することで、非同期通信のすべての機能を完了できます。つまり、このメソッドを使用すると、どのような状況でも非同期リフレッシュ操作を実行できます。ただし、パラメーターがたくさんあるので、少し面倒なこともあります。一般的に使用されるパラメーターをご覧ください：

var configobj = {

//}

$ .ajax（configobj）; // $ .ajax関数を介して呼び出します。个一一、実際の例を見てください。非同期削除の例を見てください:

& lt; spam style =
"font-size: 18px; & gt;" ️ URL:
"${pageContext.request.contextPath}/org/doDelete.action",
//Path

id}"

json json形式で送信されます。 "#tipmsg"）

. $, $. Post、この関数は実際には $ .ajax をさらにパッケージ化し、パラメータを減らして操作を簡素化していますが、使用範囲は狭くなります。 $.post はデータ送信方法を簡素化し、POST 経由でのみ送信できます。サーバーには同期ではなく非同期でのみアクセスでき、エラー処理は実行できません。このような状況では、この関数を使用してプログラミングを容易にすることができます。メソッド、非同期などの主要なパラメータはデフォルトで設定されており、変更することはできません。例は再度紹介しません。

url: リクエストアドレスを送信します。

data: 送信されるキー/値パラメーター。
callback: 送信成功時のコールバック関数。
type: コンテンツ形式、xml、html、script、json、text、_default を返します。 . $$

、$.GET は、$ .post と同様に、get メソッドの送信データにカプセル化されており、非同期更新メソッドを解決するためにのみ使用できます。ここではこれ以上のデモンストレーションはありません。

$。設定する必要があるパラメータは 3 つだけで、非常に単純です: url、[data]、[callback]。

実際、$.ajax メソッドを理解すれば、他のものはすべて同じように使用できます。

しかし、ここにはさらに厄介な別の問題があります。つまり、ページ上のデータ量が比較的大きい場合はどうすればよいでしょうか?通常のフォームの処理では、フレームワーク Struts2 を使用して、ドメイン駆動モードを通じてカプセル化を自動的に取得します。では、ajax を通じてカプセル化するにはどうすればよいでしょうか。ここで、JQuery には Jquery Form というプラグインがあり、この js ファイルを導入することで、Struts2 のドメイン駆動モードをサポートするフォームフォームを模倣し、データの自動カプセル化を実行できます。使用法は $.ajax と似ています。実際の例を見てください。ユーザーを保存するためのフロントエンドコードは次のとおりです。 $（

function（）{

$（ "tipmsg"）。テキスト（
"データが保存されている、待ってください..."）;}、
"組織が正常に保存されました"）;
. ("組織の保存に失敗しました");
$("# insertBtn").attr(
"無効",
$('#orgForm').ajaxForm(options); // Jque の ajaxForm メソッドを通じて送信します。 ry.フォーム
}); /span>
したがって、データのカプセル化処理を実行する必要がなく、非同期リフレッシュ操作などの ajax 操作が大幅に簡素化されます。要約すると、JQuery での ajax 操作はフォーム処理とよく似ていますが、実装されている機能は異なります。
から

以上がJQueryでのajaxカプセル化の説明の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。