Struts2+jQuery+Json 实现用户登陆

小鱼儿 2023-10-16 23:20 1阅读 0赞

**先简单说说Json的一些优点，当然Json不仅仅这些优点:**

1.方便前台数据的操作。

2.数据体积小，传输快。

3.客户端操纵XML的时候需要创建ActiveX对象，Json则完全就是一个JS对象，它不需要创建DOM。

**使用Struts2+jQuery+Json 实现简单用户登陆**

(1) 登录页面login.jsp

(2)脚本login.js

$(function(){
    
        $("#submit").click(function(){
    		
    	 //接收数据格式为TEXT
         /*   $.ajax({
                type: "POST", /// 数据发送方式
                url: "login.action", // 后台处理程序
                dataType: "text", // 接收数据格式
                data: { // 要传递的数据
                    "user.username": $("#username").val(),
                    "user.password": $("#password").val()
                },
                error: function(){//请求失败时调用函数。
                    $("#msg").html("请求失败!");
                },
                success: function(data){ //请求成功后回调函数。
                    alert(data);
                    var obj = eval("(" + data + ")");//转换为json对象 
                    $("#msg").html(obj.message);
                }
                
            });
    		*/
    	//接收数据格式为JSON
    	 $.ajax({
                type: "POST", /// 数据发送方式
                url: "login.action", // 后台处理程序
                dataType: "json", // 接收数据格式
                data: { // 要传递的数据
                    "user.username": $("#username").val(),
                    "user.password": $("#password").val()
                },
                error: function(){//请求失败时调用函数。
                    $("#msg").html("请求失败!");
                },
                success: function(data){ //请求成功后回调函数。
                    alert(data);  //如果接收数据dataType的值为“json”，就不用对返回值进行eval()处理了，因为它已经是json格式的了
                    $("#msg").html(data.message).css("color","black");
    				// $("#msg").html(data.user.username+"-->"+data.user.password);
                }
                
            });
            
        });
        
        
        
        
    });

</pre><p></p><pre>

(3)处理Action LoginAction.java

public class LoginAction extends ActionSupport {
    
    	private User user; //用户对象的封装setXXX and getXXX
    
    	public User getUser() {
    		return user;
    	}
    
    	public void setUser(User user) {
    		this.user = user;
    	}
    
    	private String message;
    
    	public String getMessage() {
    		return message;
    	}
    
    	public void setMessage(String message) {
    		this.message = message;
    	}
    
    	@Override
    	public String execute() throws Exception {
    		// TODO Auto-generated method stub
    		if ("sa".equals(user.getUsername()) & "aaa".equals(user.getPassword())) {
    			message = "登陆成功!";
    		} else {
    			message = "用户名或密码有误!";
    		}
    		return SUCCESS;
    	}
    
    }

(4) struts.xml配置文件

(5) 测试成功

![Center][]![Center 1][]

[Center]: https://img-blog.csdn.net/20160328170038176?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center
[Center 1]: https://img-blog.csdn.net/20160328170131190?watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQv/font/5a6L5L2T/fontsize/400/fill/I0JBQkFCMA==/dissolve/70/gravity/Center