溫馨提示×

您好，登錄后才能下訂單哦！

密碼登錄×
登錄注冊(cè)×
其他方式登錄
點(diǎn)擊 登錄注冊(cè) 即表示同意《億速云用戶服務(wù)條款》

SSH+jquery+ajax奇葩整合

發(fā)布時(shí)間：2020-07-04 20:54:04 來源：網(wǎng)絡(luò) 閱讀：2231 作者：ky673671303 欄目：web開發(fā)

近期學(xué)習(xí)了SSH2（Struts2+Spring+Hibernate）的整合后，開始嘗試的寫一個(gè)登陸界面，結(jié)果發(fā)現(xiàn)：若是單單使用struts2來進(jìn)行頁面跳轉(zhuǎn)的話頁面的效果不怎么樣，同時(shí)也無法進(jìn)行局部刷新（即異步提交驗(yàn)證）。

于是，我開始在網(wǎng)上搜索解決的辦法，有些說通過一個(gè)隱藏的iframe來達(dá)到效果，當(dāng)我總覺得麻煩和不實(shí)用。后來問了下老師，告訴了我使用ajax可以達(dá)到想要的效果，我又發(fā)現(xiàn)網(wǎng)上有很多例子都是ajax的，但缺少的就是SSH2(整合好的)和ajax 的整合（ajax使用了jQuery框架）。

說說我想要的效果：

  1. 登錄頁面點(diǎn)擊提交后 進(jìn)行后臺(tái)的驗(yàn)證；

  2. 驗(yàn)證成功跳轉(zhuǎn)到index.Jsp;

  3. 驗(yàn)證失敗則在本登錄頁面執(zhí)行一個(gè)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>會(huì)員登陸</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', 
             //提交數(shù)據(jù)給Action傳入數(shù)據(jù) 
             data:{'User':user,'PassWord':passWord}, 
             //返回的數(shù)據(jù)類型
             dataType:'json', 
             //成功是調(diào)用的方法
             success:function(data){ 
             //獲取Action返回的數(shù)據(jù)用   data.Action中的屬性名  獲取
                   if(data.result=="false")
                   {
                      alert("賬號(hào)密碼錯(cuò)誤");
                   }elseif(data.result=="true"){
                     //進(jìn)行頁面跳轉(zhuǎn)，因?yàn)閍jax我們的Action只返回?cái)?shù)據(jù)，不在進(jìn)行跳轉(zhuǎn)了...
                   location.href = "index.jsp";
                   }
                   }   
         });
    });
    });
</script>
  </head>
  <body>
  賬號(hào)：<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傳過來的數(shù)據(jù)直接使用前臺(tái)的屬性名即可獲取。
       fUser.setUserEmail(User);
       fUser.setUserPassWord(PassWord);
 
       if(fUserServiceImp.CheckUser(fUser)!=null){
           //返回給ajax的數(shù)據(jù)
           this.result = "true";
       }else{
           this.result = "false";
       }
       return"success";
    }
}


 

 

Struts.xml

 

<?xml version="1.0"encoding="UTF-8"?>
 
<struts>
    <!—這是我們配置SSH時(shí)配置Struts的package -->
    <package name="Struts" extends="struts-default">
       <action name="login"class="loginAction">
       </action>
    </package>
    <!—為了讓ajax可以調(diào)用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框架整合的不需要改動(dòng)這樣就可以將jQuery框架的ajax整合入SSH2框架使用了！

以上內(nèi)容個(gè)人言論，如果有什么地方不對(duì)，請(qǐng)大家留意…我會(huì)努力改正！

好了，祝大家幸福愉快！

 


向AI問一下細(xì)節(jié)

免責(zé)聲明：本站發(fā)布的內(nèi)容（圖片、視頻和文字）以原創(chuàng)、轉(zhuǎn)載和分享為主，文章觀點(diǎn)不代表本網(wǎng)站立場(chǎng)，如果涉及侵權(quán)請(qǐng)聯(lián)系站長(zhǎng)郵箱：is@yisu.com進(jìn)行舉報(bào)，并提供相關(guān)證據(jù)，一經(jīng)查實(shí)，將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI
助
手