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验证用户名是否存在的实例代码，希望对大家有所帮助，如果大家有任何疑问欢迎给我留言小编会及时回复大家的！

赞 (0)

相关推荐

  • Ajax实现异步用户名验证功能

    Ajax实现异步用户名验证功能

    先看看布局比较简单,效果图如下 ajax功能: 当用户填写好账号切换到密码框的时候,使用ajax验证账号的可用性.检验的方法如下:首先创建XMLHTTPRequest对象,然后将需要验证的信息(用户名)发送到服务器端进行验证,最后根据服务器返回状态判断用户名是否可用. function checkAccount(){ var xmlhttp; var name = document.getElementById("account").value; if (window.XMLHttpR

  • 用AJAX实现页面登陆以及注册用户名验证的简单实例

    AJAX即"Asynchronous Javascript And XML"(异步JavaScript和XML),是指一种创建交互式网页应用的网页开发技术. AJAX 是一种用于创建快速动态网页的技术.其核心是 JavaScript 对象 XMLHttpRequest.该对象在 Internet Explorer 5 中首次引入,它是一种支持异步请求的技术.简而言之,XMLHttpRequest使您可以使用 JavaScript 向服务器提出请求并处理响应,而不阻塞用户. 通过在后台与

  • 使用struts2+Ajax+jquery验证用户名是否已被注册

    推荐阅读:JQuery+Ajax+Struts2+Hibernate框架整合实现完整的登录注册 在用户模块中的用户注册需求上,通常要进行用户名是否已被注册的验证,今天正好写了这个需求,把详细代码和所遇到的问题贴过来.在使用struts2+ajax时候,通常我们会返回json类型的数据,但是像上面的例子,我们只希望返回一个1和0有助于进行后续判断即可,没必要返回json类型,返回一个text字符串就可以了. regist.jsp(这里只提供<script>部分): <script type

  • jsp+ajax实现无刷新(鼠标离开文本框即验证用户名)实现思路

    jsp+ajax实现无刷新,鼠标离开文本框即验证用户名,操作如下:新建一个输入页面,起名为input.jsp, 复制代码 代码如下: <%@ page contentType="text/html; charset=utf-8"%> <html> <head> <title>jsp+ajax实现无刷新_鼠标离开文本框即验证用户名</title> <meta http-equiv="Content-Type&qu

  • Ajax实现异步刷新验证用户名是否已存在的具体方法

    Ajax实现异步刷新验证用户名是否已存在的具体方法

    都是简单的实例,所以直接发代码 静态页面Ajax.html 复制代码 代码如下: <html>    <head>        <title>Ajax</title>        <script type="text/javascript">            function loadXMLDoc() {                if (document.getElementById("account

  • Ajax使用原生态JS验证用户名是否存在

    直接上代码: reg_ajax.html <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Ajax请求servlet实现用户名是否存在验证</title> </head> <body> <script type="text/javascript"> /** * 得到XMLHttpReque

  • PHP+Ajax异步通讯实现用户名邮箱验证是否已注册( 2种方法实现)

    PHP+Ajax异步通讯实现用户名邮箱验证是否已注册( 2种方法实现)

    前 言 直接上代码有点不厚道.于是按照天朝传统,整段描述吧....(本人语言表达能力有限,大家忍着看) 功 能 在网站注册用户时使用,主要为了无刷新异步验证用户输入的用户名或者Email是否已注册. 这功能大家肯定见过,大多数网站都有的,我一直对这个功能很感兴趣,所以这几天研究了下 jQuery + Ajax 整了一个功能不算完善,但足以应付普通使用的代码 (更牛的功能大家自己去发掘) 文 件 说 明 reg.php //为注册页面 check_user.php //为用户验证页面 (GET,P

  • ajax验证用户名和密码的实例代码

    本文实例为大家介绍了ajax验证用户名和密码的具体代码,供大家参考,具体内容如下 1.ajax主体部分 var xmlrequest; function createXMLHttpRequest(){ if(window.XMLHttpRequest){ xmlrequest=new XMLHttpRequest(); } else if(window.ActiveXObject){ try{ xmlrequest=new ActiveXObject("Msxm12.XMLHTTP")

  • 基于jQuery实现Ajax验证用户名是否存在实例

    基于jQuery实现Ajax验证用户名是否存在实例

    本文章向大家分享基于jQuery实现的Ajax 验证用户名是否存在的实现代码,需要的码农朋友可以参考一下本文的源代码. jQuery.ajax概述 HTTP 请求加载远程数据. 通过jQuery 底层 AJAX 实现.简单易用的高层实现见 $.get, $.post 等.$.ajax() 返回其创建的 XMLHttpRequest 对象.大多数情况下你无需直接操作该对象,但特殊情况下可用于手动终止请求. $.ajax() 只有一个参数:参数 key/value 对象,包含各配置及回调函数信息.详

  • 基于Ajax用户名验证、服务条款加载、验证码生成的实现方法

    基于Ajax用户名验证、服务条款加载、验证码生成的实现方法

     Ajax(asynchronous javascript and xml)异步的javascript和xml. 是为了解决传统的web应用中"发送请求-等待响应"这种模式的弊端,(浏览器在发送完请求后,只能等待服务器的响应,用户不能做其他的操作,浏览器发送完请求,会抛弃整个页面,等待服务器返回新的页面,也就是说,浏览器和服务器之间交互的数据量很大,不能做到按需获取数据)而创建的技术,该技术的本质是:通过一个浏览器内置的一个对象(XmlHttpRequest)异步地向服务器发送请求.

随机推荐