<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>Title</title> <script src="js/jquery-2.1.0.min.js"></script> <script> $(function () { $("#username").blur(function () { var user_name = $(this).val(); //发送ajax请求 1请求资源路径 重点注意！路径不需要写反斜杠 / 2参数{} 3回调函数:返回值调用的函数 $.get("findUserServlet",{username:user_name},function (data) { //期望d返回的数据格式是：{“userExsit”： true ，“msg"："用户名存在"} //{“userExsit”： fase ，“msg"："用户名不存在"} if(data.userExsit){ $("#user_").css("color","red"); $("#user_").html(data.msg); }else { $("#user_").html(data.msg); } },"json") //“json”_指定返回数据的格式，不然就会把返回的数据当做字符串格式，不会当做json对象格式！ 那么就无法获取对应的值了 //或者在 服务器端指定MEMI类型： response.setContentType("application/json;charset=utf-8") }); }); </script> </head> <body> <form> <input type="text" id="username" name="username" placeholder="请输入用户名"><span id="user_"></span><br/> <input type="password" id="psd" name="psd" placeholder="请输入密码"><br/> <input type="submit" value="注册"> </form> </body> </html>
请求的服务端
package servlet; import com.fasterxml.jackson.databind.ObjectMapper; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import java.io.IOException; import java.util.HashMap; import java.util.Map; @WebServlet("/findUserServlet") public class FindUserServlet extends HttpServlet { protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { doGet(request, response); } protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException { //response.setContentType("text/html;charset=utf-8"); response.setContentType("application/json;charset=utf-8"); String username = request.getParameter("username"); System.out.println(username); Map<String,Object> map = new HashMap<String,Object>(); if(username.equals("tom")) { map.put("userExsit",true); map.put("msg","用户名存在"); }else { map.put("userExsit",false); map.put("msg","用户名不存在"); } //将其用JackSom工具 写成jason格式传输出去 使用前需要导入jackson的jar包 ObjectMapper ob = new ObjectMapper(); ob.writeValue(response.getWriter(),map); //想要返回去的数据要客户端当做 json数据看待的话必须设置 response.setContentType("application/json;charset=utf-8") //或者在客服端页面的ajax请求的数据类型写成 “json” } }