TA的每日心情 | 开心 2021-3-12 23:18 |
---|
签到天数: 2 天 [LV.1]初来乍到
|
原理:利用Ajax实现无刷新登录,注销。登录前页面显示登录表单,登录后显示欢迎信息,并利用返回的javaScript把登录表单隐藏。单击注销后,又利用返回的JavaScript把欢迎信息隐藏,把登录表单显示。
[color=#990066,strength=3);]divLogin.jsp
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="struts" %>
<HTML>
<struts:head theme="ajax" debug="false"/>
<body>
<div class="div" id="loginDiv">
<div id="errorDiv"></div>
<struts:form name="divLoginForm" id="divLoginForm">
<struts:label label="请输入用户名密码"></struts:label>
<struts:textfield name="username" label="账号" value="zhangjie"></struts:textfield>
<struts:password name="password" label="密码" value="zhangjie" title="zhangjie"></struts:password>
<struts:url action="divLogin!login" id="divLoginUrl"></struts:url>
<struts:submit value=" 登录 " formId="divLoginForm" theme="ajax"
href="%{divLoginUrl}" targets="loginSuccessDiv" executeScripts="true"></struts:submit>
</struts:form>
</div>
<div id="loginSuccessDiv" class="div" style="display:none;"></div>
</body>
</html>
注:submit标签要设置href,theme,formId,targets与executeScript。href要用url标签定义,formId要与登录表单的id,name一致。登录Action代码如下:
[color=#990066,strength=3);]DivLoginAction.java
@Results([email=value=%7B@Result(name=%22script%22,value=%22/divLoginScript.jsp]value={@Result(name="script",value="/divLoginScript.jsp[/email]")})
public class DivLoginAction extends ActionSupport {
private String username;
private String password;
public String execute(){
return "input";
}
public String login(){
if("zhangjie".equals(username) && "zhangjie".equals(password)){ //如果密码匹配
ServletActionContext.getRequest().getSession(true) //放到session中
.setAttribute("username", username);
ServletActionContext.getRequest().setAttribute("status", "success"); //标记为失败
}else{
ServletActionContext.getRequest().setAttribute("status", "failed");
}
return "script";
}
public String logout(){
ServletActionContext.getRequest().getSession(true)
.removeAttribute("username"); //从session中移除
ServletActionContext.getRequest().setAttribute("status", "logout"); //标记为注销
return "script";
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
public String getUsername() {
return username;
}
public void setUsername(String username) {
this.username = username;
}
}
注:登录,注销时都会返回带有JavaScript程序的JSP页面,代码如下:
[color=#990066,strength=3);]divLoginScript.jsp­
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%@ taglib uri="/struts-tags" prefix="struts" %>
<html>
<struts:head theme="ajax" debug="false"/>
<body>
<struts:bean name="java.util.Date" id="date"></struts:bean>
<struts:if test="%{#request.status == 'success'}"> <!-- 如果登录成功 -->
欢迎您,<struts:property value="#session.username"/>.登录时间:
<struts:date name="%{#date}"/>.
<struts:url action="divLogin!logout" id="divLogoutUrl"></struts:url> <!-- 注销URL -->
<struts:a href="%{#divLogoutUrl}" theme="ajax" executeScripts="true">注销</struts:a>
<script>
document.getElementById("errorDiv").innerHTML = ""; //将error置空
document.getElementById("loginDiv").style.display = "none"; //将登录框隐藏
document.getElementById("loginSuccessDiv").style.display = ""; //显示成功信息
</script>
</struts:if>
<struts:elseif test="%{#request.status == 'failed'}"> <!-- 登录失败 -->
<script>
document.getElementById("errorDiv").innerHTML = "登录失败,错误的用户名密码。";
</script>
</struts:elseif>
<struts:else>
<script>
document.getElementById("loginDiv").style.display = "";
document.getElementById("loginSuccessDiv").innerHTML = "";
document.getElementById("loginSuccessDiv").style.display = "none";
</script>
</struts:else>
</body>
</html>
­运行效果如图:
­[color=#990066,strength=3);]
[color=#990066,strength=3);][color=#990066,strength=3);] |
|