Ajax+Jsp+Access实现的唯一性校验例子

digyso

浏览: 142117 次
性别:
来自: 北京

最近访客更多访客>>

bluecoyote

明少

ljj389

janehuaw

博主相关

博客

微博

相册

留言

关于我

文章分类

全部博客 (111)

社区版块

存档分类

Access JSP Ajax SQL IE

如标题，Ajax+Jsp+Access实现的唯一性校验例子，这里主要说明的是Ajax的原理，为了使得大家把例子下载下来就能运行，所以使用Access数据库，而且不需要配置数据源头，使用Tomcat发布就可以啦！
主要代码如下：
check.js:

Java代码

/**
*@authorfuhao
*/
varhttp_request=false;
//向服务器发起XMLHTTP请求
functionsend_request(){
//获得文本框里面输入的用户名
varloginname=document.getElementById("userName").value;
//要请求的服务器地址
url="check.jsp?userName="+loginname;
http_request=false;
//开始初始化XMLHttpRequest对象
if(window.XMLHttpRequest){//说明是Mozila浏览器
http_request=newXMLHttpRequest();
if(http_request.ovverideMimeType){//设置MiME类别
http_request.ovverideMimeType('text/xml');
}
}
elseif(window.ActiveXObject){//说明是IE浏览器
try{
http_request=newActiveXObject("Msxml2.XMLHTTP");
}catch(e){
try{
http_request=newActiveXObject("Microsoft.XMLHTTP");
}catch(e){}
}
}
if(!http_request){//异常，创建对象实例失败
alert("创建XMLHttpRequest对象失败");
returnfalse;
}
http_request.onreadystatechange=callback;
//确定发送请求的方式和URL
http_request.open("GET",url,true);
http_request.send(null);
}
//处理返回信息的函数
functioncallback(){
if(http_request.readystate==4){//判断对象状态
if(http_request.status==200){//说明信息已经成功的返回
displays();
}else{
alert("从服务器返回的状态是:"+http_request.statusText);
}
}else{
document.getElementById("div").style.display="";
}
}
functiondisplays(){
vardiv=document.getElementById("div");
div.innerHTML=http_request.responseText;
}
functiondocheck(){
varloginname=document.getElementById("userName").value;
document.getElementById("div").style.display="none";
if(loginname==""){//判断文本框是否为空
document.getElementById("div").style.display="none";
returnfalse;
}else{
document.getElementById("div").style.display="";
//为了观察效果，设置延迟
setTimeout(send_request,3000);
}
}

服务器端代码，check.jsp:

Java代码

<%@pagelanguage="java"contentType="text/html;charset=GBK"
pageEncoding="GBK"import="java.sql.*"%>
<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=GBK">
<title>Inserttitlehere</title>
</head>
<body>
<%
//获得客户端传来的用户名
StringuserName=request.getParameter("userName");
System.out.println("useName:"+userName);
//获得Access数据库的绝对路径
Stringrealpath="data/database.mdb";
//获得Access数据库的相对路径
Stringdbpath=application.getRealPath(realpath);
//设置数据库连接的字符串
Stringurl="jdbc:odbc:driver={MicrosoftAccessDriver(*.mdb)};DBQ="+dbpath;
//加载驱动程序
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
//建立数据库连接
Connectionconn=DriverManager.getConnection(url);
//创建语句对象
Statementstmt=conn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,ResultSet.CONCUR_READ_ONLY);
Stringsql="";
//创建查询数据库的SQL语句
sql="select*fromuserwhereuser_Name='"+userName+"'";
System.out.println("sql:"+sql);
//得到数据集
ResultSetrs=stmt.executeQuery(sql);
if(rs.next()){
out.println("对不起，该用户名已经被注册了");
}else{
out.println("恭喜你，该用户名可以注册");
}
//关闭数据库连接
rs.close();
stmt.close();
conn.close();
%>
</body>
</html>

客户端代码，index.html:

Java代码

<!DOCTYPEhtmlPUBLIC"-//W3C//DTDHTML4.01Transitional//EN""http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<metahttp-equiv="Content-Type"content="text/html;charset=GBK">
<title>测试校验</title>
<LINKmedia=allhref="css/style.css"type=text/cssrel=stylesheet>
<scripttype="text/javascript"src="js/check.js"></script>
</head>
<body>
<formaction=""method="">
<br/><br/><br/><palign="center"><fontcolor="green"size="4">Ajax+Jsp+Access唯一性校验例子</font></p>
<tablealign='center'border='1'bordercolor='#8CB3E3'width="55%"cellpadding='0'cellspacing='0'>
<tbodyid="tbodyid">
<tr>
<tdnowrapclass="data_tab_tdr"width="10%">用户名：</td>
<tdclass="data_tab_tdl"width="15%">
<inputtype="text"name="userName"size="25"id="userName"onchange="docheck()"/>
</td>
<tdclass="data_tab_tdl"width="15%"><divid="div"style="display:none"><imgsrc="images/ajax-loader.gif"></div></td>
</tr>
</tbody>
</table>
</form>
</body>
</html>