JSP AJAX之Form序列化登录体验
【摘要】
package web; import java.io.IOException;import java.io.PrintWriter; import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.htt...
-
package web;
-
-
-
import java.io.IOException;
-
import java.io.PrintWriter;
-
-
import javax.servlet.ServletException;
-
import javax.servlet.http.HttpServlet;
-
import javax.servlet.http.HttpServletRequest;
-
import javax.servlet.http.HttpServletResponse;
-
-
import net.sf.json.JSONArray;
-
-
import bean.User;
-
-
public class LoginServlet extends HttpServlet {
-
/**
-
*
-
*/
-
private static final long serialVersionUID = 1L;
-
@Override
-
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
-
throws ServletException, IOException {
-
PrintWriter out=resp.getWriter();
-
String username=req.getParameter("username");
-
String userpwd=req.getParameter("userpwd");
-
String str="";
-
User user=new User(username,userpwd);
-
StringBuilder sb=new StringBuilder();
-
sb.append("{");
-
-
if(user!=null){
-
//JSONArray array=JSONArray.fromObject(user);
-
//str=array.toString();
-
sb.append("\"name\":\""+user.getUsername());
-
sb.append("\",");
-
sb.append("\"pwd\":\""+user.getPwd());
-
sb.append("\"");
-
}
-
sb.append("}");
-
System.out.println(sb);
-
out.print(sb);
-
out.close();
-
}
-
@Override
-
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
-
throws ServletException, IOException {
-
this.doGet(req, resp);
-
}
-
public static void main(String[] args) {
-
User user=new User("a","b");
-
String str="";
-
if(user!=null){
-
JSONArray array=JSONArray.fromObject(user);
-
str=array.toString();
-
}
-
System.out.println(str);
-
}
-
}
前端页面
-
<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
-
<%
-
String path = request.getContextPath();
-
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
-
%>
-
-
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
-
<html>
-
<head>
-
<base href="<%=basePath%>">
-
-
<title>My JSP 'index.jsp' starting page</title>
-
<meta http-equiv="pragma" content="no-cache">
-
<meta http-equiv="cache-control" content="no-cache">
-
<meta http-equiv="expires" content="0">
-
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
-
<meta http-equiv="description" content="This is my page">
-
<script type="text/javascript" src="js/jquery-1.8.3.min.js"></script>
-
<script type="text/javascript">
-
$(function(){
-
//Ajax开始的时候，#tip元素显示；结束时，隐藏；
-
$("#tip").ajaxStart(function(){
-
$(this).show();
-
}).ajaxStop(function(){
-
$(this).hide();
-
});
-
//下面设置按钮的单击事件;
-
$("#btnLogin").click(function(){
-
//发送异步请求，设置参数；
-
$.ajax({
-
url:'LoginServlet',
-
type:'post',
-
data:$("#userForm").serialize(),//序列化form，右括号
-
dataType:'json',
-
success:function(data){
-
//成功调用函数中，根据返回的json对象进行判断;
-
//如果有name属性代表登录成功，否则为失败
-
if(data.name){
-
$(".divTitle").html("<span>登录成功</span>");
-
$(".clsShow").html("欢迎你"+data.name+" "+"登录<br/>密码:"+data.pwd);
-
}else{
-
$("#divError").html("用户名或密码错误").show();//display:block
-
}
-
},
-
error:function(xhr,msg){alert(msg);}
-
});
-
});
-
});
-
</script>
-
</head>
-
-
<body>
-
<div class="divFrame">
-
<div class="divTitle">
-
<span>用户登录</span>
-
</div>
-
<div class="divContent">
-
<div id="tip">全力登录中,请稍后...</div>
-
<div class="clsShow">
-
<div id="divError" class="divError"></div>
-
<!-- 给Form设置一个ID -->
-
<form id="userForm">
-
<!-- 要序列化的表单字段必须有name属性 -->
-
<div>
-
名称：<input type="text" id="username" name="username" class="txt"/>
-
</div>
-
<div>
-
密码:<input type="password" id="userpwd"name="userpwd"class="txt">
-
</div>
-
<div><!-- 最后一个div包含两个按钮 -->
-
<input type="button"id="btnLogin" value="登录" class="btn"/>
-
<input type="reset" id="btnReset"value="取消"class="btn"/>
-
</div>
-
</form>
-
</div>
-
</div>
-
-
</div>
-
</body>
-
</html>
针对json数据的处理，大家可以使用json-lib.jar包或gson包，将实体类对象转化为字符串进行回传
文章来源: aaaedu.blog.csdn.net，作者：tea_year，版权归原作者所有，如需转载，请联系作者。
原文链接：aaaedu.blog.csdn.net/article/details/53311439
【版权声明】本文为华为云社区用户转载文章，如果您发现本社区中有涉嫌抄袭的内容，欢迎发送邮件进行举报，并提供相关证据，一经查实，本社区将立刻删除涉嫌侵权内容，举报邮箱：
cloudbbs@huaweicloud.com
- 点赞
- 收藏
- 关注作者
评论（0）