Tmall_Fore_simulateLogin
imgAndInfo.jsp中，包含了加入购物车和立即购买，对这两个按钮进行监听
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" isELIgnored="false"%>
两个监听器，通过class进行监听，这两个按钮都会通过JQuery的get方法，用异步ajax的方式访问forecheckLogin，获取当前是否登录状态
如果返回的不是"success" 即表明是未登录状态，那么就会打开登录的模态窗口
$(".buyLink").click(function(){
var page = "forecheckLogin";
$.get(
page,
function(result){
if("success"==result){
var num = $(".productNumberSetting").val();
location.href= $(".buyLink").attr("href")+"&num="+num;
}
else{
$("#loginModal").modal('show');
}
}
);
return false;
});$(".addCartLink").click(function(){
var page = "forecheckLogin";
$.get(
page,
function(result){
if("success"==result){
var pid = ${p.id};
var num= $(".productNumberSetting").val();
var addCartpage = "foreaddCart";
$.get(
addCartpage,
{"pid":pid,"num":num},
function(result){
if("success"==result){
$(".addCartButton").html("已加入购物车");
$(".addCartButton").attr("disabled","disabled");
$(".addCartButton").css("background-color","lightgray")
$(".addCartButton").css("border-color","lightgray")
$(".addCartButton").css("color","black")
}
else{
}
}
);
}
else{
$("#loginModal").modal('show');
}
}
);
return false;
});loginModal.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8" isELIgnored="false"%>
这里重点回顾一下Ajax的内容：
首先单击立即购买或者加入购物车时，触发事件。
事件中可以看出，page是访问的页面，function是响应的方法。其中传参并没有用到。
$(".buyLink").click(function(){
var page = "forecheckLogin";
$.get(
page,
function(result){
if("success"==result){
var num = $(".productNumberSetting").val();
location.href= $(".buyLink").attr("href")+"&num="+num;
}
else{
$("#loginModal").modal('show');
}
}
);
return false;
});然后根据Servlet+Filter
调用ForeServlet的checkLogin方法
public String checkLogin(HttpServletRequest request, HttpServletResponse response, Page page) {
User user =(User) request.getSession().getAttribute("user");
if(null!=user)
return "%success";
return "%fail";
}并且根据BaseForeServlet
else if(redirect.startsWith("%"))
response.getWriter().print(redirect.substring(1));可知，如果user存在，会返还success，否则返还fail
不存在时，会通过JS调用窗口
类似于，调用了id=loginModal的模块，然后在moadl.jsp中找到对应的id（被footer.jsp包含），于是调用。
然后再登录过程中，进行Ajax对用户进行验证，包含在imgAndInfo.jsp中
$("button.loginSubmitButton").click(function(){
var name = $("#name").val();
var password = $("#password").val();
if(0==name.length||0==password.length){
$("span.errorMessage").html("请输入账号密码");
$("div.loginErrorMessageDiv").show();
return false;
}
var page = "foreloginAjax";
$.get(
page,
{"name":name,"password":password},
function(result){
if("success"==result){
location.reload();//页面刷新
}
else{
$("span.errorMessage").html("账号密码错误");
$("div.loginErrorMessageDiv").show();
}
}
);
return true;
});对应方法
public String loginAjax(HttpServletRequest request, HttpServletResponse response, Page page) {
String name = request.getParameter("name");
String password = request.getParameter("password");
User user = userDAO.get(name,password);
if(null==user){
return "%fail";
}
request.getSession().setAttribute("user", user);
return "%success";
} 最终，实现模拟登录