この記事では、SSH+Jquery+Ajax の統合に基づいて部分更新を実現する方法を紹介します。興味のある友人は、この記事を一緒に読んでください。最近 SSH2 (Struts2+Spring+Hibernate) の統合を学習した後、試し始めました。ログイン インターフェイスを作成する場合、struts2 を使用してページにジャンプするだけでは、ページの効果があまり良くなく、部分的な更新 (つまり、非同期送信の検証) を実行することもできないことがわかりました。
そこで、インターネットで解決策を探し始めました。隠し iframe を使用することで効果が得られるという意見もありましたが、それは面倒で非現実的であると常に感じていました。後で先生に尋ねたところ、ajax を使用すると目的の効果が得られると聞きました。インターネット上には ajax の例がたくさんありますが、欠けているのは SSH2 (統合) と ajax (ajax は を使用します) の統合です。 jQuery フレームワーク )。
希望する効果について教えてください:
ログインページで送信をクリックすると、バックグラウンド検証が実行されます。
検証が成功した場合は、index.Jspにジャンプします。
検証が失敗した場合は、jQueryスクリプトが実行されます。このログイン ページで実行してユーザーにプロンプトを表示します。
必要なパッケージ:
SSH2 で使用されるパッケージに加えて、struts2 の次のパッケージも必要です:
commons-beanutils-1.8.0.jar
commons-collections -3.1.jarcommons-fileupload-1.3.1.jar
commons-io-2.2.jar
commons-lang-2.4.jar
commons-lang3-3.1.jar
commons-logging-1.1.3.jar
ezmorph -1.0.6.jar
freemark-2.3.19.jar
json-lib-2.3-jdk15.jar
ognl-3.0.6.jar
struts2-core-2.3.16.3.jar
struts2-json-plugin-2.3 .16.3.jar
xwork-core-2.3.16.3.jar
それでは、コードの投稿を始めましょう:
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type"content="text/html; charset=utf-8" />
<title>会员登陆</title>
<!-- 必须添加jQuery 否则ajax将不启用。-->
<script type="text/javascript"src="js/jquery.js"></script>
<script type="text/javascript">
$(document).ready(function(){
$("#button").click (function(){
varuser =$("#User").val();
varpassWord =$("#PassWord").val();
$.ajax({
//这里的需要Struts.xml的<action/>的name属性一致。
url:‘login.action‘,
//提交类型
type:‘POST‘,
//提交数据给Action传入数据
data:{‘User‘:user,‘PassWord‘:passWord},
//返回的数据类型
dataType:‘json‘,
//成功是调用的方法
success:function(data){
//获取Action返回的数据用 data.Action中的属性名 获取
if(data.result=="false")
{
alert("账号密码错误");
}elseif(data.result=="true"){
//进行页面跳转，因为ajax我们的Action只返回数据，不在进行跳转了...
location.href = "index.jsp";
}
}
});
});
});
</script>
</head>
<body> アカウント:
パスワード:
<input id="button" type="button"value="提交" /> </body> </html>ログインアクション。 java
publicclass LoginAction extends ActionSupport {
//使用@Resource注解注入条件属性名与 ref要一致才可
@Resource
FUserService fUserServiceImp;
@Resource
FUser fUser;
private String User;
private String PassWord;
private String result;
public String getResult() {
returnresult;
}
publicvoid setUser (String User) {
this.User = User;
}
publicvoid setPassWord(String PassWord) {
this.PassWord = PassWord;
}
public String execute() throws Exception {
HttpServletRequest request = ServletActionContext.getRequest();
//获取ajax传过来的数据直接使用前台的属性名即可获取。
fUser.setUserEmail(User);
fUser.setUserPassWord(PassWord);
if(fUserServiceImp.CheckUser(fUser)!=null){
//返回给ajax的数据
this.result = "true";
}else{
this.result = "false";
}
return"success";
}
}
<?xml version="1.0"encoding="UTF-8"?>
<struts>
<!—这是我们配置SSH时配置Struts的package -->
<package name="Struts" extends="struts-default">
<action name="login"class="loginAction">
</action>
</package>
<!—为了让ajax可以调用Spring中的Action 配置ajax的package -->
<package name="ajax_json" extends="json-default">
<!—本处的id就是ajax url的值，class引用了Spring 配置Action的id-->
<action name="login" class="loginAction">
<result name="success" type="json"/>
</action>
</package>
</struts> 上記は、皆さんのためにまとめたものです。今後皆さんのお役に立てれば幸いです。
関連記事:
AJAXパラメータを構築してフォーム要素をJSONに変換する Spring MVC環境に実装されたJSON形式データに対するAjax非同期リクエスト ブラウザの傍受を防ぐための新しいフォームを開くajaxコールバック 効果的な方法_ AJAX 関連以上がSSH+Jquery+Ajax フレームワークの統合の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。
JavaScriptの役割：WebをインタラクティブでダイナミックにするApr 24, 2025 am 12:12 AMJavaScriptは、Webページのインタラクティブ性とダイナミズムを向上させるため、現代のWebサイトの中心にあります。 1）ページを更新せずにコンテンツを変更できます。2）Domapiを介してWebページを操作する、3）アニメーションやドラッグアンドドロップなどの複雑なインタラクティブ効果、4）ユーザーエクスペリエンスを改善するためのパフォーマンスとベストプラクティスを最適化します。
CおよびJavaScript：接続が説明しましたApr 23, 2025 am 12:07 AMCおよびJavaScriptは、WebAssemblyを介して相互運用性を実現します。 1）CコードはWebAssemblyモジュールにコンパイルされ、JavaScript環境に導入され、コンピューティングパワーが強化されます。 2）ゲーム開発では、Cは物理エンジンとグラフィックスレンダリングを処理し、JavaScriptはゲームロジックとユーザーインターフェイスを担当します。
Webサイトからアプリまで：JavaScriptの多様なアプリケーションApr 22, 2025 am 12:02 AMJavaScriptは、Webサイト、モバイルアプリケーション、デスクトップアプリケーション、サーバー側のプログラミングで広く使用されています。 1）Webサイト開発では、JavaScriptはHTMLおよびCSSと一緒にDOMを運用して、JQueryやReactなどのフレームワークをサポートします。 2）ReactNativeおよびIonicを通じて、JavaScriptはクロスプラットフォームモバイルアプリケーションを開発するために使用されます。 3）電子フレームワークにより、JavaScriptはデスクトップアプリケーションを構築できます。 4）node.jsを使用すると、JavaScriptがサーバー側で実行され、高い並行リクエストをサポートします。
Python vs. JavaScript：ユースケースとアプリケーションと比較されますApr 21, 2025 am 12:01 AMPythonはデータサイエンスと自動化により適していますが、JavaScriptはフロントエンドとフルスタックの開発により適しています。 1. Pythonは、データ処理とモデリングのためにNumpyやPandasなどのライブラリを使用して、データサイエンスと機械学習でうまく機能します。 2。Pythonは、自動化とスクリプトにおいて簡潔で効率的です。 3. JavaScriptはフロントエンド開発に不可欠であり、動的なWebページと単一ページアプリケーションの構築に使用されます。 4. JavaScriptは、node.jsを通じてバックエンド開発において役割を果たし、フルスタック開発をサポートします。
JavaScript通訳者とコンパイラにおけるC/Cの役割Apr 20, 2025 am 12:01 AMCとCは、主に通訳者とJITコンパイラを実装するために使用されるJavaScriptエンジンで重要な役割を果たします。 1）cは、JavaScriptソースコードを解析し、抽象的な構文ツリーを生成するために使用されます。 2）Cは、Bytecodeの生成と実行を担当します。 3）Cは、JITコンパイラを実装し、実行時にホットスポットコードを最適化およびコンパイルし、JavaScriptの実行効率を大幅に改善します。
JavaScript in Action：実際の例とプロジェクトApr 19, 2025 am 12:13 AM現実世界でのJavaScriptのアプリケーションには、フロントエンドとバックエンドの開発が含まれます。 1）DOM操作とイベント処理を含むTODOリストアプリケーションを構築して、フロントエンドアプリケーションを表示します。 2）node.jsを介してRestfulapiを構築し、バックエンドアプリケーションをデモンストレーションします。
JavaScriptとWeb：コア機能とユースケースApr 18, 2025 am 12:19 AMWeb開発におけるJavaScriptの主な用途には、クライアントの相互作用、フォーム検証、非同期通信が含まれます。 1）DOM操作による動的なコンテンツの更新とユーザーインタラクション。 2）ユーザーエクスペリエンスを改善するためにデータを提出する前に、クライアントの検証が実行されます。 3）サーバーとのリフレッシュレス通信は、AJAXテクノロジーを通じて達成されます。
JavaScriptエンジンの理解：実装の詳細Apr 17, 2025 am 12:05 AMJavaScriptエンジンが内部的にどのように機能するかを理解することは、開発者にとってより効率的なコードの作成とパフォーマンスのボトルネックと最適化戦略の理解に役立つためです。 1）エンジンのワークフローには、3つの段階が含まれます。解析、コンパイル、実行。 2）実行プロセス中、エンジンはインラインキャッシュや非表示クラスなどの動的最適化を実行します。 3）ベストプラクティスには、グローバル変数の避け、ループの最適化、constとletsの使用、閉鎖の過度の使用の回避が含まれます。
ホットAIツール
Undresser.AI Undress
リアルなヌード写真を作成する AI 搭載アプリ
AI Clothes Remover
写真から衣服を削除するオンライン AI ツール。
Undress AI Tool
脱衣画像を無料で
Clothoff.io
AI衣類リムーバー
Video Face Swap
完全無料の AI 顔交換ツールを使用して、あらゆるビデオの顔を簡単に交換できます。
人気の記事
ホットツール
SublimeText3 英語版
推奨: Win バージョン、コードプロンプトをサポート!
メモ帳++7.3.1
使いやすく無料のコードエディター
SublimeText3 中国語版
中国語版、とても使いやすい
mPDF
mPDF は、UTF-8 でエンコードされた HTML から PDF ファイルを生成できる PHP ライブラリです。オリジナルの作者である Ian Back は、Web サイトから「オンザフライ」で PDF ファイルを出力し、さまざまな言語を処理するために mPDF を作成しました。 HTML2FPDF などのオリジナルのスクリプトよりも遅く、Unicode フォントを使用すると生成されるファイルが大きくなりますが、CSS スタイルなどをサポートし、多くの機能強化が施されています。 RTL (アラビア語とヘブライ語) や CJK (中国語、日本語、韓国語) を含むほぼすべての言語をサポートします。ネストされたブロックレベル要素 (P、DIV など) をサポートします。
ゼンドスタジオ 13.0.1
強力な PHP 統合開発環境
