HTML代碼

//如果使用<input>當(dāng)作表單提交按鈕，按照下面這么寫，兩者選其一
<form id="accountForm">    
//注意這里input的name和action獲取前端數(shù)據(jù)有關(guān)，所以必須對(duì)應(yīng)起來(lái).
<input id="username" name="username" type="text">    
<input id="password" name="password" type="password">    
<input id="submitButton" type="button" value="登錄">
</form>

//如果使用<button>當(dāng)作表單提交按鈕擂仍，按照下面這么寫瞬欧，兩者選其一
<form id="accountForm">    
//注意這里input的name和action獲取前端數(shù)據(jù)有關(guān)臭蚁，所以必須對(duì)應(yīng)起來(lái).
<input id="username" name="username" type="text">    
<input id="password" name="password" type="password">    
<form>
<button  id="submitButton">登陸</button>

//<form>標(biāo)簽里面不應(yīng)該使用<button>標(biāo)簽２痉稀Ｐ姆尽Ｃ诌洹过蹂！
.....
<script>    
  $(document).ready(function () {
    $("#submitButton").click(function () {            
      var username = $("#username").val();            
      var password = $("#password").val();            
      if (username == "" || password == "") {                
        alert("用戶名和密碼不能為空，請(qǐng)重新輸入");                
        $("#username").val("");                
        $("#password").val("");            
      } else {                
          $.ajax({                    
            type:"post",                    
            url:"login",
            //將表單內(nèi)容序列化成一個(gè)字符串聚至，如下：username=wwc&password=wwc榴啸，如果是post請(qǐng)求，那么這串字符串就以請(qǐng)求體的方式傳遞給后端action                    
            data:$("#accountForm").serialize(),                    
            datatype:"json",                    
            success:function (data) {                        
              var d = eval("(" + data + ")");                        
              if (d.login == "success") {                        
                window.location.href = "index.html";                        
              } else if (d.login == "false") {                            
                  alert("用戶名或密碼錯(cuò)誤 \r 請(qǐng)重新輸入");                            
                  $("#username").val("");                            
                  $("#password").val("");                        
              }                    
            },                    
            error:function () {                        
              alert("系統(tǒng)異常");                    
            }                
        });            
      }        
    });    
  });
</script>

Action代碼

public class LoginAction extends ActionSupport implements ModelDriven {    
  private UserService userService;
  //這個(gè)result字符串是在struts.xml里配置的action的返回結(jié)果晚岭，必須對(duì)應(yīng).    
  private String result; 
  //必須提供result字符串的get方法鸥印，否則前端無(wú)法獲取數(shù)據(jù).   
  public String getResult() {        
    return result;    
  }
  //這是利用spring框架將userService注入到LoginAction中，并賦值為L(zhǎng)oginAction的屬性坦报。（雖然與ajax提交表單沒(méi)有直接聯(lián)系库说，但是在整個(gè)程序中用到，所以貼一下.）    
  public void setUserService(UserService userService) {          
    this.userService = userService;    
  }    
  //模型驅(qū)動(dòng)
  //這里會(huì)有一個(gè)User類片择，并且User類用有String username和String password兩個(gè)屬性潜的，這兩個(gè)的屬性名和表單中input標(biāo)簽的name必須相同！Ｗ止堋啰挪！   
  private User user = new User();    
  public Object getModel() {        
    return user;    
  }    
  @Override    
  public String execute() throws Exception {
  //判斷該用戶在數(shù)據(jù)庫(kù)中是否存在
    boolean checkUser = userService.checkUser(user.getUsername(), user.getPassword());        
    if (checkUser) {
      //返回給前臺(tái)ajax的數(shù)據(jù)，為什么result知道返回給ajax呢嘲叔？這個(gè)在struts.xml中會(huì)給出答案            
      result = "{\"login\":\"success\"}";        
    } else {            
        result = "{\"login\":\"false\"}";        
    }  
    return "success";    
  }
}

User類代碼

//用struts2框架亡呵，必須提供空構(gòu)造方法和屬性的get、set方法
public class User {    
  private Integer id;    
  private String username;    
  private String password;    

  public User() {}
    
  public User(String username, String password) {        
    this.username = username;       
    this.password = password;    
  }    

  public Integer getId() {        
    return id;    
  }    
  public void setId(Integer id) {        
    this.id = id;    
  }    

  public String getUsername() {        
    return username;    
  }    
  public void setUsername(String username) {        
    this.username = username;    
  }    

  public String getPassword() {        
    return password;    
  }    
  public void setPassword(String password) {        
    this.password = password;    
  }
}

struts.xml中的配置

//必須加上json-default硫戈，要使用這個(gè)標(biāo)簽必須引入struts2-json-plugin-2.3.15.3.jar這個(gè)包
<package name="user" extends="struts-default, json-default">     
  <action name="login" class="loginAction" method="execute">        
    <result name="success" type="json">
      //這里的result就是Action類中的那個(gè)result锰什，必須對(duì)應(yīng)         
      <param name="root">result</param>      
    </result>   
  </action>
</package>