AJAX用户名的检验

转载 2007年09月18日 09:58:00

学习使用AJAX之前,有几样的东西是必须的:
1、HTML
2、DHTML,就是动态HTML,这里可能会常用到document.getElementById([id])方法,或者是使用window.id.value=[value]等等,如果不熟悉,不及,看看下面的例子,如果还不能够理解,再把网上搜搜,这方面的解释多得不能够再多了。
3、Javascript。这个就是非常的重要的,因为好多东西都需要通过这个去操作。
4、DOM。这个不是必须的,就算我们不知道这个东西,照样可以用JAVASCRIT做很多的东西了。
5、数据库操作及SQL知识。现在应用程序好多都是与数据库打交道,常见的用户名信息等等,都是放在数据库中的。
下面进行正题吧,这个实例非常的简单,采用JSP实现用户输入的用户是否存在于数据库中,并且给以相应的提示,所谓“麻雀虽小,五脏俱全”,其它的发挥就是在这个方向上发挥开发。
总共有三个文件,有两个JSP面,一个用于前台显示,一个用于确定用户是否存在;另外一个JAVA页面,用于做数据库连接。
注:请注意其中注释,那是非常的有助于你理解
前台显示:index.jsp
<html>
<head>
<title></title>
<script language="javascript" >
var httpRequest;
/**
下面这个函数可以返回一个适合任何浏览器的httpRequest,步子如下:
1.试着创建一个XMLHttpRequest()示例,该示例可适合于除了微软以外的所有浏览器
2.增加错误判断,如果当前浏览器是微软的,那么就创建适用于微软的浏览器
3.但微软的浏览器又有两个版本之分,不过据说微软已经在7.0中增加对XMLHttpRequest()的支持
4.但这样也需要对原来的浏览器支持,否则你写出来的程序那些用老版本浏览器的用户就是看不
到效果的。
*/
function createRequest()
{
    try{
        request=new XMLHttpRequest();
    }catch(trymicrosoft)
    {
        try{
            request=new ActiveXObject("Msxml2.XMLHTTP");
        }catch(othermicrosoft)
        {
            try{
                request=new ActiveXObject("Microsoft.XMLHTTP");
            }
            catch(failed)
            {
                request=false;
            }
        }
    }
    if(!request)
    {
       alert("err Happend!");
       return null;
    }       
    return request;
}
/**
这个函数就是用户的动作所有触发的函数,如下面的onblur()时,就会调用该函数
经过的步骤如下:
1.从HTML页面得到你需要的数据,可以采有document.getElementById("")方法。
2.建立需要的URL,该URL就和在FORM里面的method为get时并采用submit提交在地址栏
里面到的一样
3.打开与服务器的连接,这里面有三个必要的参数,虽然文档规定只有两个,但是我个
人觉得最好用三个,
第一个可以是GET,POST或者是POST,但常用的就是前面的两个,并且最好都用大写,因
为有些浏览器如FireFox可能会报错,
第二个就是打报的URL,这肯定你是必须的。
第三个就是下面的看到的true,这里可以是false。true表示同步处理,你提交后可以做
其它的事情,这就是AJAX里面的A,即asynchronous;如是false,那就得等到服务器的返
回才能够做其它的事情。
4.等到服务器完成,并且确定返回执行了正确执行的提示,我们就可以做下面我们想做的
事情。这些后面的事情就必须通过Javascript去完成了,因为XMLHttpRequest的唯一用途
就是发送请求及接收服务器的响应结果。
5.上面都完成了后,就可以采用send()方法向服务器发送你需要发送的信息了,它的参数
可以是任何类型,发送的数据格式必须为这样的格式:
name=value&anothername=othervalue&so=on,如果你想传送数据,你必须更改MIME类型:
httpRequest.setRequestHeader('Content-type','application/x-www-form-urnlencoded');
否则服务器将会丢弃发送的数据。
*/
function getBackInfo()
{
    var username=document.getElementById("username").value;
    var url='checkUser.jsp?username='+username;
    request.open("GET",url,"true");
    //下面相当于是一个隐性的循环,在函数中规定只有都接收完毕数据后才做处理
    //onreadystatechange有5个值:
    // 0:未初始化
    // 1:初始化
    // 2:发送数据
    // 3:接收数据中
    // 4:数据接收完毕
    //另外还要注意就是在注册回调函数onreadystatechange时,后面的函数不能够带参数
    //如下disResult是一个函数,不能够带参。
    reqeust.onreadystatechange=disResult;//隐性的循环
    request.send(null);
}
function disResult()
{
/**
1.一定要确定readystate==4的完成状态才做下面的事,否则会在建立连接即readystate==1的
时候就开始,然后会在readystate==2,readystate==3,readystate==4的时候都会执行,不信
你可以alert("")一个提示信息试试。
2.服务器通知完成了,并且还要保证是正确完成的,得到的是我们需要的结果才能够继续,这里
常用响应码有:
200:成功执行
401:未授权
403:禁止
404:没有找到文件
*/
    if(request.readystate==4)
    {
        if(request.status==200)
        {
            //一切都OK了,那就该用Javascript去执行你想要的动作了。
            document.getElementById("disCheckResult").value=request.responseText;
            alert('done');
        }
        else
        {
            alert('Something Wrong has Happend!');
        }
    }
}
</script>
</head>
<body>
  <form>
    <table>
        <tr>
            <td>
                <input type=text id="username" onblur="getBackInfo();">
            </td>
            <td>              
                <dd id="disCheckResult">这里用于在执行后显示结果的地方</dd>
            </td>
        </tr>
    </table>
  </form>
</body>
</html>
用于验证的JSP页面:checkUser.jsp
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
<%@ page contentType="text/html;charset=GBK"%>
<%@ page import="project1.DBMS_Conn"%>
<html>
  <head>
    <meta http-equiv="Content-Type" content="text/html; charset=GBK"/>
    <title>checkUser</title>
  </head>
  <body>
  <%
    String username=request.getParameter("username");
    DBMS_Conn conn=new DBMS_Conn();
    if(conn.checkUser(username))
        out.println("用户名已经存在!");
//这个信息就是发送到前台去显示的信息,即服务器返回的信息
    else
        out.println("可以继续!");
  %>
  </body>
</html>数据库连接JAVA程序:
package project1;
import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;
public class DBMS_Conn {
    Connection conn;
    Statement st;
    public DBMS_Conn() {
        conn_init();
    }
    void conn_init() {
        setConnection();
        setStatement();
    }
    public void setConnection() {
        try {
            //Class.forName("org.gjt.mm.mysql.Driver").newInstance();
            Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
            //db.mdb有一个名为user表,至少有一个名为username的字段
            String strurl =
            "jdbc:odbc:driver={Microsoft Access Driver (*.mdb)};DBQ=E://db.mdb";
            //conn=DriverManager.getConnection("jdbc:mysql://localhost/palfinger?
            //user=root&password=admin&useUnicode=true&characterEncoding=8859_1");
            conn = DriverManager.getConnection(strurl);
        } catch (Exception e) {
            e.printStackTrace();
        }
    }
    /**
     * 设置Statement
     */
    public void setStatement() {
        try {
            st = conn.createStatement(
ResultSet.TYPE_SCROLL_INSENSITIVE, ResultSet.CONCUR_READ_ONLY);
        } catch (SQLException e) {
            e.printStackTrace();
        }
    }
    /**
     * 根据用户名确定用户是否存在
     */
    public boolean checkUser(String username) {
        String sql="select * from user where username='"+username+"'";
        ResultSet rs;
        try {
            rs = st.executeQuery(sql);
            if(rs.next())
            {
                conn.close();
                return true;
            }           
        } catch (SQLException e) {
            e.printStackTrace();
        }
        try {
            conn.close();
        } catch (SQLException e) {
            e.printStackTrace();
        }
        return false;
    }  
}
本文转自建站学  http://www.jzxue.com

 

利用AJAX来检测用户名是否已经被注册

实现功能: 在注册表单中,当用户填写了用户名后,把光标移开后,会自动向服务器发送异步请求。服务器返回true或false,返回true表示这个用户名已经被注册过,返回false表示没有注册过。客户端...
  • duyifei01
  • duyifei01
  • 2016年08月05日 23:55
  • 2988

spring+jquery+ajax 检测用户名是否存在

spring+jquery+ajax 检测用户名是否存在 话不多说,直接上代码 register.jsp
  • baidu_34386466
  • baidu_34386466
  • 2016年12月10日 18:42
  • 1535

Java+Ajax实现用户名重复检验

今天,我来教大家怎么实现Java+Ajax实现用户名重复检验。
  • sinat_35512245
  • sinat_35512245
  • 2017年05月02日 17:49
  • 1438

简单使用Ajax实现异步查询用户名是否被占用

Hello!大家好,我是Eugene_Y。今天学了一招,是使用Ajax实现异步查询用户名是否被占用。 我是菜鸟,所以会以一个菜鸟的角度去阐述,希望各位小伙伴们看到了能有收获! 要做这个需要用到Ser...
  • Eugene_Y
  • Eugene_Y
  • 2017年02月15日 18:41
  • 649

Jquery Ajax用户检验用户是否存在的例子

大家都知道Jquery其实就是javascript一个框架。 框架就是为了方便我们开发,要实现他里面的功能我们只需要调用相应的方法就可以啦。 现在几乎所有的网站注册,都会提前的检查用户是否存在。这...
  • yejin191258966
  • yejin191258966
  • 2014年02月16日 12:14
  • 1324

JSP+Serverlet+javaScript+ajax实现实时检测用户名是否被占用

网上搜了些实时监测用户名的脚本例子,没效果,结合别人的例子写了下面这个,实现在用户名输入框失去焦点时,检测用户名是否可用,并修改当前页面的样式。         ............  ...
  • yichangzxc
  • yichangzxc
  • 2016年05月21日 13:33
  • 1166

用ajax实现检测注册用户名是否重复的完整例子(一)

网上搜索了很多案例,但都和自己的需求不一样。  最终实现了下面的例子实现了对注册用户名的校验。采用的架构是servelet+jsp.  JSP页面代码:  Html代码   ...
  • asdfzjs
  • asdfzjs
  • 2014年08月05日 15:26
  • 4078

Ajax中检验用户名的方法

Ajax中检验用户名的方法(js文件): function checkName(){ var name = this.value; //1.第一步获取XMLHttpRequest对象 v...
  • wang_liang_
  • wang_liang_
  • 2013年11月11日 09:04
  • 462

jquery+jsp+servlet+ajax实现注册功能,ajax校验用户名、验证码等(转自他人)

具体见:http://m.blog.csdn.net/Damionew/article/details/73048150
  • feifei318
  • feifei318
  • 2017年09月21日 11:19
  • 240

JAVA-----Ajax实现注册用户名唯一性检查

通过对HTML输入完毕后,释放编辑框焦点。执行判断是否用户名已被注册的及时提醒操作。 html文本 Ajax实现用户注册名唯一性检查 var xmlHttpReq=null; f...
  • tianwei3
  • tianwei3
  • 2017年10月26日 16:23
  • 238
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:AJAX用户名的检验
举报原因:
原因补充:

(最多只允许输入30个字)