Ajax验证用户名是否存在的实例代码
更新时间：2019年04月08日 14:30:29 作者：白凤一剑
这篇文章主要介绍了Ajax验证用户名是否存在的实例代码，代码简单易懂，非常不错，具有一定的参考借鉴价值,需要的朋友可以参考下
jsp页面
<head> <script type="text/javascript" src="js/register.js"></script> </head> <table> <td>用户名：</td> <td> <input type="text" name="r_name" id="r_name" onblur="CheckUserName()"> <span id="span01"></span> </td> </table>
js文件夹下的register.js
//创建对象
function ajaxFunction(){
var xmlHttp;
try{
// 适用于IE7+, Firefox, Chrome, Opera, Safari
xmlHttp=new XMLHttpRequest();
}
catch(e){
try{
//Internet Explorer
xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");
}
catch(e){
try{
// 适用于IE6, IE5
xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
catch(e){
xmlHttp=false;
}
}
}
return xmlHttp;
}
var flag=ture;
function CheckUserName(){
//获取jsp页面输入的值
var name=document.getElementById("r_name").value;
if(name==""||name==null){
document.getElementById("span01").innerHTML="<font color='red'>用户名不能为空！</font>"
flag=false;
}else{
//1.创建对象
var request=ajaxFunction();
//2.发送请求
request.open("POST","/StudyWeb/CheckUserNameServlet",true);//true表示异步提交
//注册状态改变监听，获取服务器传送过来的数据
request.onreadystatechange=function(){
//readyState==4表示请求已经完成，且响应已就绪。status==200表示“OK”
if(request.readyState==4 && request.status==200){
var data=request.responseText;//获取CheckUserNameServlet中response中存储的值
if(data == 1){
document.getElementById("span01").innerHTML="<font color='red'>用户名已存在！</font>"
flag=false;
}else{
document.getElementById("span01").innerHTML="<font color='green'>√</font>"
flag=true;
}
}
}
//如果是post方式带数据，那么这里要添加头，说明提交的数据类型是一个经过url编码的form表单数据
request.setRequestHeader("Content-type","application/x-www-form-urlencoded;charset=UTF-8");
//带数据过去，在send方法里填写表单数据
request.send("name="+name);
}
return flag;
}
后台StudyWeb项目下的CheckUserNameServlet
protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
//获取ajax发送过来的name值
String r_name=request.getParameter("name");
try {
//检验是否存在该用户名
boolean isExist=userService.CheckUserName(r_name);
System.out.println("isExist"+isExist);
//通知页面，到底有没有
if(isExist){
response.getWriter().println(1);//存在用户名
}else{
response.getWriter().println(2);//不存在该用户
}
} catch (Exception e) {
e.printStackTrace();
}
}
UserDaoImpl中方法的实现
public boolean CheckUserName(String u_name) {
boolean flag=false;
String sql="select u_id,u_name,u_password,u_email,u_phone from user where u_name=?";
conn=super.getConnection();
try {
pstmt=conn.prepareStatement(sql);
pstmt.setString(1,u_name);
rs=pstmt.executeQuery();
//如果存在我输入的用户名和数据库表中已有的用户名相同时
if(rs.next()){
flag=true;
}
} catch (SQLException e) {
e.printStackTrace();
}finally{
super.closeAll(conn, pstmt, stmt, rs);
}
return flag;
}
总结
以上所述是小编给大家介绍的Ajax验证用户名是否存在的实例代码，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言小编会及时回复大家的！
相关文章
在(ASP/PHP/JSP/html/js)中禁止ajax缓存的方法集锦
禁止ajax缓存最简单的办法就是在js端直接生成一个随机数了，但是有时会发现此方法不适用于post了，如果我们要禁止post 提交数据的ajax缓存需要怎么处理呢，下面我整理了很多关于禁止ajax缓存的例子2014-08-08
下面小编就为大家带来一篇ajax内部值外部调用不了的原因及解决方法。小编觉得挺不错的，现在就分享给大家，也给大家做个参考。一起跟随小编过来看看吧2016-06-06
本文为大家介绍下ajax同步异步的简单实现，感兴趣的朋友可以参考下2014-01-01
这篇文章主要为大家详细介绍了ajax实现数据分页查询的相关资料，以及ajax实现对数据库的查询，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-02-02
ajax刷新是一种用户体验良好的刷新方式,这篇文章主要介绍了ajax异步请求刷新,感兴趣的小伙伴们可以参考一下2016-08-08
常利用AJAX写一些页面无刷新的内容获取页面，这种方式很快捷也很方便，但其中有一个问题，就是如果两次提交的参数相同时，返回的内容只返回上次获取的内容，如果我们在第一次修改了参数，第二次再次调用却会发现页面根本没有改变。2008-09-09
这篇文章主要介绍了Ajax实现模拟关键字智能匹配搜索效果,当在搜索框输入内容时，根据关键字匹配，显示弹出层，非常不错，具有参考借鉴价值，需要的朋友可以参考下2016-12-12
XMLHTTP多浏览器兼容性写法...2007-11-11
这篇文章主要为大家详细介绍了Ajax实现一个漂亮、安全登录界面的方法，具有一定的参考价值，感兴趣的小伙伴们可以参考一下2017-07-07
这篇文章主要介绍了服务端配置实现AJAX跨域请求的相关资料,需要的朋友可以参考下2015-02-02
最新评论