`
java-xb
  • 浏览: 124843 次
  • 性别: Icon_minigender_1
  • 来自: 上海
社区版块
存档分类
最新评论

在jsp中使用ajax技术示例:验证用户是否存在

阅读更多
首先说明一下几个名词的意思,我自己理解的

jquery 网上说是JavaScript库或框架。
ajax 一种可以进行异步通信的技术。
本实例用到了jquery库
具体实现步骤如下:
1.下载jquery库 我下载的是jquery-1.3.2.js,我试过了支持jsp,好像jquery.js不支持jsp,我也没测试成功,哪位大哥在jquery.js下面测试成功了,告我啊
2.把它放在一个web工程webroot目录下面的一个文件夹里面(如 js文件夹里面)
3.编写服务器端的程序:
  AjaxServlet.java
public class AjaxServlet extends HttpServlet {
	
	protected void doGet(HttpServletRequest request, HttpServletResponse response)
			throws ServletException, IOException {
		response.setContentType("text/html;charset=utf-8");
		PrintWriter out = response.getWriter();
		String username  = request.getParameter("name");
		System.out.println(username);
		if(username==null){
			out.println("请输入用户名");
		}
		else if(username.equals("admin")){
		 ut.println("用户名已经被注册了");
		}
		else{
		out.println("用户名"+username+"可以进行注册");
		}
					
	}
	protected void doPost(HttpServletRequest request,HttpServletResponse response)
	throws ServletException, IOException {
		
		doGet(request,response);
	}
	
	public void destroy() {
		
		super.destroy();
	}
	
	public void init() throws ServletException {
		
		super.init();
	}	
	
}


配置web-xml文件
代码如下
<?xml version="1.0" encoding="UTF-8"?>
<web-app version="2.4" 
	xmlns="http://java.sun.com/xml/ns/j2ee" 
	xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance" 
	xsi:schemaLocation="http://java.sun.com/xml/ns/j2ee 
	http://java.sun.com/xml/ns/j2ee/web-app_2_4.xsd">
    <servlet>
    <servlet-name>AjaxServlet</servlet-name>
    <servlet-class>com.servlet.AjaxServlet</servlet-class>
  </servlet>
   <servlet-mapping>
    <servlet-name>AjaxServlet</servlet-name>
    <url-pattern>/AjaxServlet</url-pattern>
  </servlet-mapping>
  <welcome-file-list>
    <welcome-file>index.html</welcome-file>
  </welcome-file-list>
</web-app>


写前台代码:
ajax.html
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
  <head>
    <title>ajax示例</title>
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
    <!--<link rel="stylesheet" type="text/css" href="./styles.css">-->
	<script type="text/javascript" src="js/verify.js"></script>
	<script type="text/javascript" src="js/jquery-1.3.2.js"></script>
	
  </head>
  
  <body>
    用户名校验Ajax实例,请输入要注册的用户名和密码:<br/>
    <!-- ajax方式不需要使用表单来进行提交数据,因此不用写表单标签 -->
    <!-- ajax方式不需要name属性,需要一个id的属性 -->
   username:<input type="text" id="username"/><br/>
   password:<input type="password" id="password"/><br/>
   <input type="button" value="检测用户是否存在" onclick="verify()"/>
   <!-- 这个div用于存放服务器返回的结果,开始为空 -->
   <div id="result"></div>
   </body>
</html>

上面得html文件里面导入了js文件,一个是jquery-1.3.2.js,一个事verify.js文件,刚才在js文件下面存放了jquery-1.3.2.js文件,需要在js文件夹下面新建一个verify.js文件
verify.js文件代码如下:
//定义用户校验的方法
function verify(){
	//alert("ajax实例");
	//1.获取文本框中的内容
	//document.getElementById("username");dom的方式
	//jquery 查找节点方式,参数中#加在id属性值可以得到一个节点
	//jquery 的方法返回的都是jquery的对象,可以继续在上面执行其他的jquery方法
	var jqueryObj1 = $("#username");
	//获取节点的值
	var username = jqueryObj1.val();
	//2.将文本框中的数据发送给服务器的servlet
	//使用jquery的xmlHttpRequest对象的get请求的封装 这几种方法都行
	//$.get(url,date,回调函数)
	$.get("AjaxServlet?name="+username,null,callback);
	//$.get("AjaxServlet",username,callback);
	//$.get("AjaxServlet","name="+username,callback);	
	
	
}
//回调函数
function callback(data){
   //alert("服务器端的数据回来了!!");
   //3.接受服务器端返回的数据	
	//4.将服务器端返回的数据动态的显示在网页上
	//找到保存结果信息的节点
	var resultObj = $("#result");
	//动态的改变页面节点div中的内容
	resultObj.html(data);
}
到此 所有的工作都做完了,测试下就知道了
分享到:
评论
1 楼 Listen_ing 2010-10-12  
运行没反应,不知道怎么回事

相关推荐

    简单的AJAX示例(JSP+servlet)

    简单的AJAX示例。验证用户名,判断用户名是否存在。包括jsp页面,web配置,servlet以及servlet.jar.

    JSP Ajax经典实例大全源代码.rar

    JSP Ajax实例集,数据库采用MYSQL,实例中大部分文件为HTML及JSP文件,部分示例名称:  第一章 动态加载数据  1.1动态加载的FAQ  1.2根据邮政编码获取地区信息  1.3动态树形列表  1.4多级联动菜单  1.5条件...

    Ajax——异步检查用户名是否存在示例

    在任何网站注册用户的时候,都会检查用户是否已经存在。很久以前的处理方式是将所有数据提交到服务器端进行验证,很显然这种方式的用户体验很不好;后来有了Ajax,有了异步交互,当用户输完用户名继续填写其他信息的...

    jQuery ajax MD5实现用户注册即时验证功能

    实际项目中比较常用的(JQuery+AJAX+MD5),属于即时验证,亮点是验证用户是否存在的那一项,具体内容如下 具体示例 registe.jsp &lt;span xss=removed&gt;&lt;&#37;@ page pageEncoding="UTF-8"%&gt; &lt;&#37;@ taglib ...

    JavaScript完全自学宝典 源代码

    \lib目录 在Java中使用JSON需要的lib包列表。 \testJson\src\jsonExercise\JSONServlet.java 处理页面请求的Servlet。 \testJson\src\jsonExercise\ComdtyBean.java 商品信息的POJO。 \testJson\Web...

    搞定J2EE:STRUTS+SPRING+HIBERNATE整合详解与典型案例 (2)

    6.3.6 在代码中使用Log4j 6.4 改进Log4j 6.5 小结 第七章 Ant使用指南 7.1 Ant介绍 7.1.1 Ant简介 7.1.2 为什么要使用Ant 7.2 建立Ant的开发环境 7.2.1 下载Ant 7.2.2 配置Ant 7.3 Ant的使用方法 7.3.1 Ant能完成的...

    源码基于JSP的webdgs.rar

    Webdgs.rar是一个基于JSP(Java Server Pages)技术构建的计算机专业源码资料包,它为开发者和学习者提供了丰富的资源,以...总而言之,webdgs.rar是一个全面的JSP学习工具包,无论是教师在教学中使用,还是学生自学,

    Ajax使用教程,入门推荐

    Ajax使用教程(五步骤),简洁明了,入门推荐,附一个验证示例(JSP+Servlet+Ajax)

    jQuery+AJAX实现遮罩层登录验证界面(附源码)

    JQuery遮罩层登录界面效果的实现,AJAX实现登录验证,文章尾有完整示例源码下载,欢迎大家学习研究。 操作系统:Windwos7 Ultimate 开发工具:Visual Studio 2010 数据库:Sql Server 2005 测试浏览器:IE8、FF3.6.8...

    JavaServer Faces 2.0完全参考手册(JSF2.0中文版) 1/2

    4.1 jsf中使用模板化的威力 4.2 jsp与facelets的异同 4.3 使用facelets执行模板化 4.4 facelets模板化标签使用指南 4.4.1 ui:composition 4.4.2 ui:decorate 4.4.3 ui:define 4.4.4 ui:insert 4.4.5 ui:include ...

    JavaServer Faces 2.0完全参考手册(JSF2.0中文版).part1

    4.1 jsf中使用模板化的威力 4.2 jsp与facelets的异同 4.3 使用facelets执行模板化 4.4 facelets模板化标签使用指南 4.4.1 ui:composition 4.4.2 ui:decorate 4.4.3 ui:define 4.4.4 ui:insert 4.4.5 ui:include ...

    国人编写的、超牛的、基于jQuery插件式、监听模式(无侵入)的html页面form表单通用验证框架

    它能监听到所有控件类型、所有数据格式,还有ajax异步验证功能(例如用户注册时去数据库查询以检查有没有重复)。消息提示有多种模式,例如在控件旁边显示消息、弹出式消息。下面提供一样注册页面验证示例: Html的...

    深入浅出Struts 2 .pdf(原书扫描版) part 1

    在丰富的示例中直观地探讨了许多实用的技术。如数据类型转换、文件上传和下载、Struts2应用的安全性、调试与性能分析、FreeMarker、Velocily、Ajax,等等。跟随作者一道深入Struts2。聆听大量来之不易的经验之谈。你...

    深入浅出Struts2(附源码)

    作者处处从实战出发,在丰富的示例中直观地探讨了许多实用的技术,如数据类型转换、文件上传和下载、提高Struts 2应用的安全性、调试与性能分析、FreeMarker、Velocity、Ajax,等等。跟随作者一道深入Struts 2,聆听...

    JAVA上百实例源码以及开源项目

     Java非对称加密源程序代码实例,本例中使用RSA加密技术,定义加密算法可用 DES,DESede,Blowfish等。  设定字符串为“张三,你好,我是李四”  产生张三的密钥对(keyPairZhang)  张三生成公钥(publicKeyZhang...

    java源码包2

     Java非对称加密源程序代码实例,本例中使用RSA加密技术,定义加密算法可用 DES,DESede,Blowfish等。  设定字符串为“张三,你好,我是李四”  产生张三的密钥对(keyPairZhang)  张三生成公钥(publicKeyZhang...

    Struts2 in action中文版

    9.1 为什么在Struts 2中使用Spring 196 9.1.1 依赖注入能做些什么 197 9.1.2 Spring如何管理对象和注入依赖 199 9.1.3 使用接口隐藏实现 200 9.2 将Spring添加到Struts 2 202 9.2.1 让Spring管理动作、拦截器和结果...

Global site tag (gtag.js) - Google Analytics