准备

  1. 导包：DBUtil，JDBC，C3P0
  2. 在src下导入c3p0-config.xml
  3. 导入JDBCUtil
  4. 创建数据库

第2.3.条查看https://blog.csdn.net/weixin_44718300/article/details/88994973

1、新建JSP页面

<body>

   	<table border="1" width="500">

   		<tr>

   			<td>用户名:</td>

   			<td><input type="text" name="name" id="name"  οnblur="checkUserName()"><span id="span01"></span></td>

   		</tr>

   		<tr>

   			<td>密码</td>

   			<td><input type="text" name=""></td>

   		</tr>

   		<tr>

   			<td>邮箱</td>

   			<td><input type="text" name=""></td>

   		</tr>

   		<tr>

   			<td>简介</td>

   			<td><input type="text" name=""></td>

   		</tr>

   		<tr>

   			<td colspan="2"><input type="submit" value="注册"></td>

   		</tr>

   	</table>

</body>

2、创建Servlet

public class CheckUserNameServlet extends HttpServlet {

	protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

		try {

			request.setCharacterEncoding("UTF-8");

			//1. 检测是否存在

			String name = request.getParameter("name");

			System.out.println("name="+name);

			UserDao dao = new UserDaomImpl();

			boolean isExist = dao.checkUserName(name);

			//2.  通知页面，到底有还是没有。

			if(isExist){

				response.getWriter().println(1);  //存在用户名

			}else{

				response.getWriter().println(2); //不存在该用户名

			}

		} catch (SQLException e) {

			e.printStackTrace();

		}

	}

	/**

	 * @see HttpServlet#doPost(HttpServletRequest request, HttpServletResponse response)

	 */

	protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {

		// TODO Auto-generated method stub

		doGet(request, response);

	}

}

3、Dao

boolean checkUserName(String username) throws SQLException;
@Override

	public boolean checkUserName(String username) throws SQLException {

		QueryRunner runner = new QueryRunner(JDBCUtil02.getDataSource());

		String sql = "select count(*) from t_user where username =?";

		runner.query(sql, new  ScalarHandler(), username);

		Long result = (Long) runner.query(sql, new  ScalarHandler(), username);

		return result > 0 ;

	}

4、修改jsp

<%@ page language="java" contentType="text/html; charset=UTF-8"

	pageEncoding="UTF-8"%>

<!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=UTF-8">

<title>Insert title here</title>

<script type="text/javascript">

	//1. 创建对象

	function  ajaxFunction(){

	   var xmlHttp;

	   try{ // Firefox, Opera 8.0+, Safari

	        xmlHttp=new XMLHttpRequest();

	    }

	    catch (e){

		   try{// Internet Explorer

		         xmlHttp=new ActiveXObject("Msxml2.XMLHTTP");

		      }

		    catch (e){

		      try{

		         xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");

		      }

		      catch (e){}

		      }

	    }

		return xmlHttp;

	 }

	function checkUserName() {

		//获取输入框的值 document 整个网页

		var name = document.getElementById("name").value; // value  value() val val()

		//1. 创建对象

		var request = ajaxFunction();

		//2. 发送请求

		request.open("POST"  ,"/day16/CheckUserNameServlet" , true );

		//注册状态改变监听，获取服务器传送过来的数据

		request.onreadystatechange = function(){

			if(request.readyState == 4 && request.status == 200){

				//alert(request.responseText);

				var data = request.responseText;

				if(data == 1){

					//alert("用户名已存在");

					document.getElementById("span01").innerHTML = "<font color='red'>用户名已存在!</font>";

				}else{

					document.getElementById("span01").innerHTML = "<font color='green'>用户名可用!</font>";

					//alert("用户名未存在");

				}

			}

		}

		request.setRequestHeader("Content-type","application/x-www-form-urlencoded");

		request.send("name="+name);

	}

</script>

</head>

<body>

<body>

	<table border="1" width="500">

		<tr>

			<td>用户名:</td>

			<td><input type="text" name="name" id="name"  οnblur="checkUserName()"><span id="span01"></span></td>

		</tr>

		<tr>

			<td>密码</td>

			<td><input type="text" name=""></td>

		</tr>

		<tr>

			<td>邮箱</td>

			<td><input type="text" name=""></td>

		</tr>

		<tr>

			<td>简介</td>

			<td><input type="text" name=""></td>

		</tr>

		<tr>

			<td colspan="2"><input type="submit" value="注册"></td>

		</tr>

	</table>

</body>

</html>

Ajax校验用户名是否可用的更多相关文章

  1. 11月10日上午ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...

  2. asp.net ajax 检测用户名是否可用代码

    原文  asp.net ajax 检测用户名是否可用代码 .net ajax 检测用户名是否可用代码 <script type="text/网页特效" src="c ...

  3. ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...

  4. 14.ajax基础知识、用ajax做登录页面、用ajax验证用户名是否可用、ajax动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...

  5. ajax 检测用户名是否可用

    下面是一个 ajax 检测用户名是否可用的例子. django  项目中. —— views.py 里—— from django.shortcuts import render,HttpRespon ...

  6. 十七 Ajax&校验用户名功能

    Ajax: 即"Asynchronous JavaScript And XML", 异步JavaScript和XML , 是指一种创建的交互式页面应用的网页开发技术,它并不是新的技 ...

  7. AJAX校验用户名是否存在，焦点离开用户名、点击 【 检 查用户名 】的校验。分别用 XMLHttp 和 JQueryAJAX实现。

     XMLHttp方法: $("#name").blur(function () { var xmlhttp = new ActiveXObject("Microsoft. ...

  8. Ajax详解及其案例分析------如何获得Ajax对象，使用Ajax对象发送GET和POST请求，校验用户名，POST和GET请求时的乱码处理，实现级联的下拉列表

    本节主要内容预览: 1 获得Ajax对象 2 使用Ajax对象发送GET请求 3 使用Ajax对象发送POST请求 4 使用Ajax校验用户名 5 POST请求时的乱码处理 6 GET请求时的乱码处理 ...

  9. 使用PHP中的ajax做登录页面、验证用户名是否可用、动态调用数据库

    1.ajax的基础知识 ajax是结合了jquery.php等几种技术延伸出来的综合运用的技术,不是新的内容.ajax也是写在<script>标签里面的. 如果使用ajax一定是要有1个处 ...

随机推荐

  1. Xilinx COE文件格式小记

    官方的参考文档是:https://www.xilinx.com/support/documentation/sw_manuals/xilinx11/cgn_r_coe_file_syntax.htm ...

  2. 802.11X用户身份验证

    静态WEP企图同时解决802.11无线网络安全的两个问题.它即打算提供身份验证以限定拥有特定密钥方能进行网络访问,也想要提供机密性以在数据经过无线链路时予以加密.然而,它在这两方面的表现都不是特别好. ...

  3. linux7 安装Docker

    Docker:用白话文简单介绍就是一个集装箱,可以将其运行环境及依赖打包,方便各种场合使用.Docker 让开发者可以打包他们的应用以及依赖包到一个可移植的容器中,然后发布到任何流行的 Linux 机 ...

  4. MySQL 批量更新、删除数据shell脚本

    #!/bin/bash. ~/.bash_profilelog=/tmp/update_log_1_$(date +%F).logvstart=1step=100vstop=$((${vstart}+ ...

  5. PHPstudy2018 后门简单使用

    首先声明,仅为记录使用. 测试用例php-5.4.45 + Apache index.php 使用Firefox 浏览器,可以编辑并且重发http请求 打印出“net user” base64 加密后 ...

  6. Yarn的资源调优

    一.概述 每个job提交到yarn上执行时,都会分配Container容器去运行,而这个容器需要资源才能运行,这个资源就是Cpu和内存. 1.CPU资源调度 目前的CPU被Yarn划分为虚拟CPU,这 ...

  7. E. MaratonIME does (not do) PAs

    E. MaratonIME does (not do) PAs time limit per test 2.0 s memory limit per test 256 MB input standar ...

  8. jenkins + gitlab 快速搭建(docker-compose) 时间，时区 同步

    记录一下吧   算打一下 tag   最近在整得 swarm + jenkins 实现自动化部署 回滚 #构建jenkins 镜像 #dockerfile:      docker build -t  ...

  9. 《ES6标准入门》(阮一峰)--6.正则的扩展

    1.RegExp 构造函数 在 ES5 中,RegExp构造函数的参数有两种情况. 第一种情况是,参数是字符串,这时第二个参数表示正则表达式的修饰符(flag). var regex = new Re ...

  10. 《分布式消息中间件实践》P153

    问题:我直接把作者的源码拷贝下来(包括xml,resource等,作者应该使用的是Eclipse,我复制到IDEA上),依赖加上.执行P153的步骤,报错如下: Exception in thread ...