`
fuhao9611
  • 浏览: 85396 次
  • 性别: Icon_minigender_1
  • 来自: 陕西 西安
最近访客 更多访客>>
社区版块
存档分类
最新评论

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

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

/**
 * @author fuhao
 */

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

服务器端代码,check.jsp:
<%@ page language="java" contentType="text/html; charset=GBK"
    pageEncoding="GBK" import="java.sql.*" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>Insert title here</title>
</head>
<body>
<%
// 获得客户端传来的用户名
String userName = request.getParameter("userName");
System.out.println("useName:"+userName);
// 获得Access数据库的绝对路径
String realpath = "data/database.mdb";
// 获得Access数据库的相对路径
String dbpath = application.getRealPath(realpath);
// 设置数据库连接的字符串
String url="jdbc:odbc:driver={Microsoft Access Driver (*.mdb)};DBQ="+dbpath;
// 加载驱动程序
Class.forName("sun.jdbc.odbc.JdbcOdbcDriver");
// 建立数据库连接
Connection conn=DriverManager.getConnection(url);
// 创建语句对象
Statement stmt=conn.createStatement(ResultSet.TYPE_SCROLL_INSENSITIVE,ResultSet.CONCUR_READ_ONLY);
String sql="";
// 创建查询数据库的SQL语句
sql="select * from user where user_Name='" +userName+ "'";
System.out.println("sql:"+sql);
// 得到数据集
ResultSet rs = stmt.executeQuery(sql);
if(rs.next()){
	out.println("对不起,该用户名已经被注册了");	
}else{
	out.println("恭喜你,该用户名可以注册");	
}
// 关闭数据库连接
rs.close();
stmt.close();
conn.close();
%>
</body>
</html>

客户端代码,index.html:
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=GBK">
<title>测试校验</title>
<LINK media=all href="css/style.css" type=text/css rel=stylesheet>
<script type="text/javascript" src="js/check.js" ></script>
</head>
<body>
<form action="" method="" >
<br /><br /><br /><p align="center"><font color="green" size="4">Ajax+Jsp+Access 唯一性校验例子</font></p>
<table align='center' border='1' bordercolor='#8CB3E3' width="55%" cellpadding='0' cellspacing='0'>
	<tbody id="tbodyid">
		<tr>
			<td nowrap class="data_tab_tdr" width="10%">用户名:</td>  
			<td class="data_tab_tdl" width="15%">
				<input type="text" name="userName" size="25" id="userName" onchange="docheck()" />
			</td>
			<td class="data_tab_tdl" width="15%"><div id="div" style="display:none"><img src="images/ajax-loader.gif"></div></td>
		</tr>
	</tbody>
</table>
</form>
</body>
</html>
  • ajaxCheck.zip (26.3 KB)
  • 描述: 全部代码,使用Tomcat5.0+IE浏览器发布即可
  • 下载次数: 381
分享到:
评论
1 楼 manus 2007-05-15  
en en  好好去学学 嘎嘎

相关推荐

    基于ajax+jsp+servlet+mysql利用IDEA实现的图书管理系统源码+数据库.zip

    【资源说明】 1、该资源包括项目的全部源码,下载可以直接使用! 2、本项目适合作为计算机、数学、电子信息等专业的课程设计、期末大作业和...基于ajax+jsp+servlet+mysql利用IDEA实现的图书管理系统源码+数据库.zip

    Ajax+JSP网站开发从入门到精通

    《Ajax+JSP网站开发从入门到精通》的源代码,全书共分为16章,包括JSP的基础知识、JSP访问外部数据、JSP高级技术、Ajax概述、Ajax相关技术、Ajax开发基础、Ajax开发模式、Ajax框架、Ajax常用技巧。本书最后介绍了6个...

    Ajax+jsp+MySQL实现动态树形菜单

    【Ajax+jsp+MySQL实现动态树形菜单】 在Web开发中,动态树形菜单是一种常见的交互元素,它能够以层次结构展示数据,提供用户友好的导航体验。本项目结合了Ajax、jsp和MySQL三种技术来实现这一功能,下面将详细阐述...

    ajax+jsp+Hibernate实现的Blog源代码

    ajax+jsp+Hibernate实现的Blog源代码

    jquery+ajax+jsp+servlet实现二级级联菜单

    ### 使用jQuery、Ajax、JSP与Servlet实现二级级联菜单 #### 一、项目背景与技术栈概述 本文档将详细介绍如何使用jQuery、Ajax、JSP与Servlet来实现一个简单的二级级联菜单功能。该功能常见于许多Web应用程序中,如...

    Ajax+jsp+oracle实现动态树形菜单

    总结来说,"Ajax+jsp+oracle实现动态树形菜单"项目是一个典型的前后端交互示例,它结合了客户端的Ajax技术、服务器端的JSP处理以及数据库操作,展示了如何高效地处理和展示层次结构的数据。通过理解这些技术的原理和...

    mysql+ajax+jsp实现三级联动

    关于联动以前都没接触过,这是我第一次学习用的例子,很实用,适合初学者下载学习

    Ajax+Jsp+Access

    总结起来,这个例子展示了如何结合Ajax、JSP和Access数据库来实现一个简单的用户输入校验功能,利用Ajax的异步特性,提高了用户体验,而JSP和Access提供了后台数据处理的能力。这种技术组合在实际开发中,尤其是在...

    ajax+struts2.0+jsp下拉列表级联

    在这个“ajax+struts2.0+jsp下拉列表级联”的示例中,我们将探讨如何利用这三个技术实现这种功能。 首先,AJAX(Asynchronous JavaScript and XML)是一种在不刷新整个页面的情况下与服务器交换数据并更新部分网页...

    超简单的ajax+jsp实现2级联动!!

    在这个"超简单的ajax+jsp实现2级联动"的例子中,我们将探讨如何利用AJAX(Asynchronous JavaScript and XML)技术和JavaServer Pages (JSP)来实现这种功能。 首先,我们需要了解AJAX的基本原理。AJAX允许网页在不...

    Ajax+jsp注册验证用户

    总的来说,"Ajax+jsp注册验证用户"的项目涵盖了前端与后端的交互、数据库操作、用户输入验证以及安全防护等多个方面,是一个综合性的Web开发实践。通过学习和实现这样的例子,开发者可以深入理解Ajax和JSP在实际项目...

    ajax+jsp草稿自动保存

    总结来说,这个Ajax+jsp草稿自动保存的实现主要依赖于前端JavaScript的Ajax功能,通过定时器定期发送请求到服务器,保存用户输入的草稿。后端JSP接收请求,处理保存操作,并返回结果。这种机制提高了用户体验,因为...

    ajax+jsp分页控件

    这里的“ajax+jsp分页控件”是一种技术解决方案,它允许用户在不刷新整个页面的情况下实现数据的分页加载,提供了更加流畅的用户体验。这种控件通常具有美观的界面设计,可以无缝地整合到各种Web应用中。 **Ajax...

    ajax+jsp digg 掘客

    【标题】"Ajax+jsp Digg 掘客"是一个基于Web技术实现的互动性网站功能,主要用于提升用户体验和参与度。这个系统的核心是利用Ajax(异步JavaScript和XML)技术与JavaServer Pages(jsp)结合,模拟Digg网站的投票...

    ajax+struts+jsp的用户名验证

    综上所述,"ajax+struts+jsp的用户名验证"是一个综合运用前端交互、后端处理和数据库查询的Web开发实践,涉及到的技术点广泛且深入,对于提升Web开发技能具有重要意义。开发者需要理解并熟练掌握Ajax、Struts、JSP...

    AJAX+servlet+jsp用户注册

    本项目"AJAX+servlet+jsp用户注册"是为初学者设计的一个典型示例,旨在教授如何使用这三种技术实现一个动态、响应式的用户注册功能。 首先,我们从JSP(JavaServer Pages)开始。JSP是Java EE平台下的一个组件,...

    jsp+ajax+servlet+jdbc案例

    在IT行业中,JavaServer Pages (JSP)、Asynchronous JavaScript and XML (AJAX)、Servlets以及Java Database Connectivity (JDBC)是构建Web应用程序的基石技术。本案例将详细阐述如何利用这些基本技术,不依赖额外的...

    ajax+.net小例子 ajax+C#示例 ajax+.net 示例 ajax分页

    功能基础,增,显,分页。适合初学者。 ajax+.net小例子 ajax+C#示例 ajax+.net 示例ajax+.net小例子 ajax+C#示例 ajax+.net 示例ajax+.net小例子 ajax+C#示例 ajax+.net 示例

    基于后端Java+tomcat+mysql+JSP+前端HTML+CSS+JS+Ajax+Jquer开发的仿豆瓣的在线博客系统

    该项目实现了仿豆瓣的在线博客系统,实现用户简单的登录注册,个人信息管理,好友关系管理,文章管理等功能,后端技术栈为Java+Servlet+tomcat+mysql+JSP,前端技术栈为HTML+CSS+JS+Ajax+Jquery。IDE是IntelliJ IDEA...

Global site tag (gtag.js) - Google Analytics