近期學習了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.jar
commons-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
freemarker-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
好了，開始貼代碼：
login.jsp
<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="User" name="User"type="text" /><br/>
密碼：<input id="PassWord" name="PassWord"type="password" /><br/>
<input id="button" type="button"value="提交" /> </body></html>
LoginAction.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"; }}
Struts.xml
<?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>
其他SSH2架構整合的不需要改動這樣就可以將jQuery架構的ajax整合入SSH2架構使用了！
以上內容是個人所想，如有不對的地方歡迎給我留言，我會在第一時間和大家取得聯絡，謝謝大家一直以來對雲棲社區網站的支援。
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
