Ajax检测用户名是否已经注册
程序功能
当用户名输入完成(即用户名输入框失去焦点),利用Ajax检测用户名是否已经注册!
实现过程
利用Ajax向CheckUserServlet发送请求,判断该用户名是否可用。这里只是为了演示Ajax的用法,就不访问数据库了,直接设置一些用户名就好了,模拟一下即可。
关于中文编码的处理
坑爹,在javascript中传递中文参数,需要先编码,然后解码。详细见JavaScript利用URL向后台传入中文参数乱码问题解决之道。
运行截图
代码实例
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>检查用户名是否唯一</title>
</head>
<script type="text/javascript">
function checkUser(username) {
if (username.value == "") {
alert("请输入用户名!");
username.focus();
return;
} else {
createRequest('CheckUserServlet?user='+encodeURI(encodeURI(username.value)));
}
}
function createRequest(url) {
http_request = false;
if (window.XMLHttpRequest) {
http_request = new XMLHttpRequest();
} else if (window.ActiveXObject) {
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;
}
//alert("创建成功!");
http_request.onreadystatechange = getResult;
http_request.open('GET', url, true);
http_request.send(null);
}
function getResult() {
if (http_request.readyState == 4) { //请求已经完成
if (http_request.status == 200) { //请求成功
document.getElementById("msg").innerHTML = http_request.responseText;
} else {
alert("你请求的页面有错误!");
}
}
}
</script>
<body>
<form method="post" name="registForm">
用户名:<input type="text" name="username" id="username" onblur="checkUser(registForm.username);">
<div id="msg"></div><br>
密 码:<input type="password" >
</form>
</body>
</html>
检查是非已经注册的工具类
package cn.edu.pzhu.servlet.util;
public class UserUtils {
private static String[] userList = {"张三", "李四", "Tom", "Jerry"};
public static boolean checkUser(String username) {
boolean ok = true;
for (int i = 0; i < userList.length; i++) {
if (username.equals(userList[i])) {
ok = false;
break;
}
}
return ok;
}
}
servlet处理
package cn.edu.pzhu.servlet;
import java.io.IOException;
import java.io.PrintWriter;
import java.net.URLDecoder;
import javax.servlet.ServletException;
import javax.servlet.annotation.WebServlet;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import org.apache.jasper.tagplugins.jstl.core.Out;
import cn.edu.pzhu.servlet.util.UserUtils;
/**
* Servlet implementation class CheckUserServlet
*/
@WebServlet("/CheckUserServlet")
public class CheckUserServlet extends HttpServlet {
private static final long serialVersionUID = 1L;
/**
* @see HttpServlet#HttpServlet()
*/
public CheckUserServlet() {
super();
// TODO Auto-generated constructor stub
}
/**
* @see HttpServlet#doGet(HttpServletRequest request, HttpServletResponse response)
*/
protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
String username = request.getParameter("user");
//解码
username = URLDecoder.decode(username, "UTF-8");
System.out.println(username);
PrintWriter out = response.getWriter();
if (UserUtils.checkUser(username)) {
out.print("该用户名可用!");
} else {
out.print("该用户名不可用!");
}
//request.getRequestDispatcher("index.jsp").forward(request, response);
}
/**
* @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);
}
}
如有不当之处欢迎指出!
Ajax检测用户名是否已经注册的更多相关文章
- ajax 检测用户名是否可用
下面是一个 ajax 检测用户名是否可用的例子. django 项目中. —— views.py 里—— from django.shortcuts import render,HttpRespon ...
- asp.net ajax 检测用户名是否可用代码
原文 asp.net ajax 检测用户名是否可用代码 .net ajax 检测用户名是否可用代码 <script type="text/网页特效" src="c ...
- Ajax验证用户名是否被注册
Ajax验证用户名是否被注册 var xmlHttp; function createXMLHttpRequest(){ // 创建XMLHttp请求对象 if(window.ActiveXObjec ...
- Django ajax 检测用户名是否已被注册
添加一个 register.html 页面 <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- MVC3学习:利用mvc3+ajax检测用户是否被注册
假设用户名是保存在表Users中.关系模式为Users(Uid,UserName,PassWord) 可先利用mvc自带的模板生成Create页面. 将填写用户名的地方,由原来的 <div cl ...
- javaweb历史上最简单的使用Ajax判断用户名是否被注册(不跳转页面奥!)
关于前端: 使用jquery-3.3.1.js记得要导入奥---最后我会附加我的源码的 哎我也不多说了新手加菜鸟jquery真的不太懂!看代码吧!个别地方我会写上我对本程序的理解. 关于后台也就是se ...
- php运用validate+ajax检测用户名是否已存在
前提:如果还不知道什么是validate,请前往这里 一.remote rules: username:{ required:true, minlength:8, maxlength:8, remot ...
- ajax验证用户名是否被注册 ; ajax提交form表单
register.html 文件代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &quo ...
- Struts2+Ajax实现检测用户名是否唯一
搞了慢慢两天,终于弄明白了怎么在Struts2框架中使用Ajax检测用户名的存在了.虽然,比起那些大牛们来,这速度确实够慢的,不过,最终弄出来还是满满的成就感啊. 闲话休提,言归正传.直接上代码: A ...
随机推荐
- Android: 工具使用备忘
Gradle Gradle本地路径设置 如果在AndroidStudio内设置了使用local的Gradle路径,就直接放那边,啥问题都不会有.如果使用推荐的设置,那么更新的时候很有可能会有问题. 在 ...
- 【深度学习系列】迁移学习Transfer Learning
在前面的文章中,我们通常是拿到一个任务,譬如图像分类.识别等,搜集好数据后就开始直接用模型进行训练,但是现实情况中,由于设备的局限性.时间的紧迫性等导致我们无法从头开始训练,迭代一两百万次来收敛模型, ...
- 添加FTP用户(vsftpd)
1.环境:ftp为vsftp. 用户名为test.默认路径为/home/test 2.新建用户(当前是root用户) 运行命令:"useradd -d /home/test test&quo ...
- Java项目专栏之数据库建表
Java项目专栏之数据库建表 数据库建表前期准备 1. 安装mysql:数据库语言,语法和sql server差不太多,如果习惯于sql server可以不用mysql. 2. 安装navicat:可 ...
- awk处理重复行错误分析
[root@localhost ~]#cat 0712 YRSD2-1-11 YRSD2-2-18 YRSD1-1-8 YRSD1-1-18 YRSD1-1-20 YRSD1-1-25 YRSD1-2 ...
- shell第四篇(下)
摘自王垠的:Unix的缺陷 我想通过这篇文章解释一下我对 Unix 哲学本质的理解.我虽然指出 Unix 的一个设计问题,但目的并不是打击人们对 Unix 的兴趣.虽然 Unix 在基础概念上有一个挺 ...
- typedef和#define的简单比较
1.通常说typedef比#define要好,尤其在有指针的情况下 typedef char* pStr1; #define pStr2 char* pStr1 s1,s2; pStr2 s3,s4; ...
- 解析js中作用域、闭包——从一道经典的面试题开始
如何理解js中的作用域,闭包,私有变量,this对象概念呢? 就从一道经典的面试题开始吧! 题目:创建10个<a>标签,点击时候弹出相应的序号 先思考一下,再打开看看 //先思考一下你会怎 ...
- AQS 框架之 Unsafe 源码详解
■ 前言 之前 LockSupport那篇已经叙述了是线程阻塞工具类,其底层由 Unsafe 实现,即 park(), unpark() 方法,获取指针偏移量,并操纵内存.本篇主要介绍 Unsafe ...
- 关于spring通知中propagation的7种配置《转载》
<转载>:http://nannan408.iteye.com/blog/1754882