程序功能

当用户名输入完成（即用户名输入框失去焦点），利用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检测用户名是否已经注册的更多相关文章

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

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

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

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

  3. Ajax验证用户名是否被注册

    Ajax验证用户名是否被注册 var xmlHttp; function createXMLHttpRequest(){ // 创建XMLHttp请求对象 if(window.ActiveXObjec ...

  4. Django ajax 检测用户名是否已被注册

    添加一个 register.html 页面 <!DOCTYPE html> <html lang="en"> <head> <meta c ...

  5. MVC3学习：利用mvc3+ajax检测用户是否被注册

    假设用户名是保存在表Users中.关系模式为Users(Uid,UserName,PassWord) 可先利用mvc自带的模板生成Create页面. 将填写用户名的地方,由原来的 <div cl ...

  6. javaweb历史上最简单的使用Ajax判断用户名是否被注册（不跳转页面奥！）

    关于前端: 使用jquery-3.3.1.js记得要导入奥---最后我会附加我的源码的 哎我也不多说了新手加菜鸟jquery真的不太懂!看代码吧!个别地方我会写上我对本程序的理解. 关于后台也就是se ...

  7. php运用validate+ajax检测用户名是否已存在

    前提:如果还不知道什么是validate,请前往这里 一.remote rules: username:{ required:true, minlength:8, maxlength:8, remot ...

  8. ajax验证用户名是否被注册 ; ajax提交form表单

    register.html 文件代码: <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" &quo ...

  9. Struts2+Ajax实现检测用户名是否唯一

    搞了慢慢两天,终于弄明白了怎么在Struts2框架中使用Ajax检测用户名的存在了.虽然,比起那些大牛们来,这速度确实够慢的,不过,最终弄出来还是满满的成就感啊. 闲话休提,言归正传.直接上代码: A ...

随机推荐

  1. 使用非java代码编程

    使用非JAVA代码     JAVA语言及其标准API(应用程序编程接口)应付应用程序的编写已绰绰有余.但在某些情况下,还是必须使用非JAVA编码.例如,我们有时要访问操作系统的专用特性,与特殊的硬件 ...

  2. libev学习笔记

    转 libev的使用--结合Socket编程 作者:cxy450019566 之前自己学过一些libev编程的基础,这次写压测刚好用上了,才算真正动手写了些东西,在这里做一些总结.写这篇文章是为了用浅 ...

  3. 2017-12-30-如何彻底清除现存GIT仓库的大量提交历史

    layout: post title: 2017-12-30-如何彻底清除现存GIT仓库的大量提交历史 key: 20171230 tags: GIT 版本管理 问答 modify_date: 201 ...

  4. React-Native 之 Modal介绍与使用

    前言 遗漏的常用组件,刚发现官方有提供,这边也来介绍一下. 如本文有错或理解偏差欢迎联系我,会尽快改正更新! 如有什么问题,也可直接通过邮箱 277511806@qq.com 联系我. 本章涉及资源下 ...

  5. springboot(十九)：使用Spring Boot Actuator监控应用

    微服务的特点决定了功能模块的部署是分布式的,大部分功能模块都是运行在不同的机器上,彼此通过服务调用进行交互,前后台的业务流会经过很多个微服务的处理和传递,出现了异常如何快速定位是哪个环节出现了问题? ...

  6. 我的前端故事----关于前端数据&逻辑的思考

    最近重构了一个项目,一个基于redux模型的react-native项目,目标是在混乱的代码中梳理出一个清晰的结构来,为了实现这个目标,首先需要对项目的结构做分层处理,将各个逻辑分离出来,这里我是基于 ...

  7. Trusted Execution Technology (TXT) --- 启动控制策略（LCP）篇

    版权声明:本文为博主原创文章,未经博主允许不得转载.http://www.cnblogs.com/tsec/p/8428631.html 在TXT平台中,启动控制策略(Launch Control P ...

  8. 51NOD 1584 加权约数和 [莫比乌斯反演 转化 Trick]

    1584 加权约数和 题意:求\(\sum_{i=1}^{N} \sum_{j=1}^{N} {\max(i,j)\cdot \sigma(i\cdot j)}\) 多组数据\(n \le 10^6, ...

  9. OI常用读入方式效率测试

    我来填坑了. 这次我用自己写的测试读入的程序来分别测试cin(不关闭流同步),scanf和读入优化的效率差别.   我们分别对三个阶段的数据量n进行测试,通过时间比对来观察性能的差异. n = 102 ...

  10. ERROR 1044 (42000): Access denied for user ''@'localhost' to database 'mysql' mysql> use mysql

    show databases;select user,password,host from user;我们想通过 查看存在"mysql"数据库中的user表来查看我们的msql数据 ...