Jquery での Ajax 構文例のまとめ

非同期 Javascript + XML) 非同期リフレッシュは、かつては、JDBC コードのようないくつかの必要な手順を実行する必要がありました。 手順: AJAX - コア XMLHttpRequest オブジェクト。 、JQuery は Ajax 非同期操作もカプセル化します。一般的なメソッドをいくつか示します。 $.post、 $.ajax、 $.get、$.getJSON。

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

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

callback: 送信成功時のコールバック関数。

type: コンテンツ形式、xml、html、script、json、text、_default を返します。

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

// 非同期更新をサポートするかどうか、デフォルトは true です

data //送信する必要があるデータ

dataType //サーバーから返されるデータのタイプ (xml、String、Json など)

success //リクエスト成功後のコールバック Function

Error //リクエスト失敗後のコールバック関数

}

$.ajax(configObj);//$.ajax 関数を通じて呼び出されます。

それでは、実際的な例を見てみましょう。非同期削除の例を見てみましょう。 "> タイプ:

"POST"

, //送信方法

URL: $ "$ {PageContext.Request.ContextPath} /org/dodelete.action"

,

// パス データ: {

"

:

"${org.id}" ️成功: 関数(結果) {

//返されたデータは結果に従って処理されます

$("#tipMsg").text(

"データの削除に成功しました "

);

「# tipMsg").text("データの削除に失敗しました");

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

4. $.getJSON、これはさらなるカプセル化です。つまり、Json の戻りデータ型で動作します。設定する必要があるパラメータは 3 つだけで、非常に単純です: url、[data]、[callback]。

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

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

function

() {

//実行する必要のある関数を処理します。前

"#insertBtn").attr( "無効"、 );

{//成功後に必要なコールバック関数を返す

if

(result.success) {

/こちらは、後で紹介する対応するツリーです、

var

tree = window。親.treeフレーム .tree ;

else { 。

tipMsg").text("組織の保存に失敗しました");

ボタン

).attr(

"disabled"

、false）; (オプション);

//Jquery.Form の ajaxForm メソッドを通じて送信します

この方法では、データをカプセル化する必要がなくなり、ajax 操作と非同期更新操作が大幅に簡素化されます。要約すると、JQuery での ajax 操作はフォーム処理とよく似ていますが、実装されている機能は異なります。プログラミングの学習とは、実際には、データの処理方法、フロント デスクからデータを取得し、対応する処理のためにサーバーに転送し、適切な表示のために返す方法を学習することです。このプロセスをいくつかのテクノロジを通じて実装することで、開発は完了します。ソフトウェアの感触はまだ非常に興味深いです。