前端就简写:
<body>
账号:<input type="text" name="username" id="user"><span id="s_username"></span><br>//span用来显示是否有该账户
密码:<input type="password" name="password" id="pass">
<script type="text/javascript">
$(function () {
$("#user").blur(function () {//失去焦点事件
var username=$(this).val();//获取input里面的值
$.get("ajaxservlet",{username:username},function (data){
//调用jquer封装get方法传递参数: url 值 回调函数 接受服务器传回来的data 就是用来处理他传完值后的函数
var span=$("#s_username");//获取span标签
if(data.users)//进行判断
{
span.css("color","red");
span.html(data.msg);
}
else{
span.css("color","green");
span.html(data.msg);
}
});
});
});
</script>
</body>
然后就是serlet代码了 这里我就简写 连数据库代码太多就直接用字符串比较把!
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String username =request.getParameter("username");//获取username 也就是input账号 的值
response.setContentType("application/json;charset=utf-8");//设置响应的数据格式 这里直接 设置为json
Map<String, Object> map=new HashMap<String, Object>(); 把响应的值存入map中
if(username.equals("349723468")) //判断是否有 进行添加返回数据
{
map.put("#s_username",true);
map.put("msg","此用户名太受欢迎,请更换一个");
}else {
map.put("#s_username",false);
map.put("msg","用户名可用");
}
ObjectMapper mapper = new ObjectMapper(); //这个是需要jar包的 网上很多
mapper.writeValue(response.getWriter(), map);
//进行转换 把 map 转换成 json 并发送回去 这里也就是那个回调函数的 data
}