ajax检测用户名是否存在

谁能给代码，我能在我电脑上跑起来效果就采纳。只求能实现，看看流程什么样子的，我用的eclipse，servlet。

直接上图：
数据库
存在
不存在
项目完整代码：
项目结构

首先需要导入MySQL驱动包：mysql-connector-java-5.1.41.jar，下面提供我共享的下载路径：
链接：https://pan.baidu.com/s/1iDDcATg7xZKApMPw-fbsyA 密码：az5z

DataBase.java：

 package com.cn.util;

import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;



public class DataBase {
    public Connection connection;        
    private static final String driver = "com.mysql.jdbc.Driver";
    private static final String url = "jdbc:mysql://localhost:3306/test";
    private static final String name = "root";
    private static final String pass = "root";

    public static Connection getConnection() {
        Connection conn = null;
        try {
            Class.forName(driver);// 动态加载mysql驱动
            // 一个Connection代表一个数据库连接
            conn = DriverManager.getConnection(url, name, pass);
        } catch (Exception e) {
            e.printStackTrace();
        }
        return conn;
    }

    public static void closeConnection(Connection conn, Statement st, ResultSet rs) {
        try {
            if (rs != null)
                rs.close();
            if (st != null)
                st.close();
            if (conn != null)
                conn.close();
        } catch (SQLException e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }

    }
}

TestServlet.java：

 package com.cn.web;

import java.io.IOException;
import java.io.PrintWriter;
import java.sql.Connection;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;

import javax.servlet.ServletConfig;
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 com.cn.util.DataBase;

@WebServlet("/login.do")
public class TestServlet extends HttpServlet {
    private static final long serialVersionUID = 1L;

    public TestServlet() {
        super();
    }

    public void init(ServletConfig config) throws ServletException {
    }

    protected void doGet(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        // TODO Auto-generated method stub
        response.getWriter().append("Served at: ").append(request.getContextPath());
    }
    protected void doPost(HttpServletRequest request, HttpServletResponse response) throws ServletException, IOException {
        PrintWriter out = response.getWriter();   //获取 out 对象
        String username = request.getParameter("username"); //接受用户名
        Connection conn = DataBase.getConnection();//获取MySQL数据库链接
        String sql = "select count(1) from user where name=?"; //sql语句
        PreparedStatement stmt;
        try {
            stmt = conn.prepareStatement(sql);
            stmt.setString(1, username); //填入参数
            ResultSet rs = stmt.executeQuery();  //执行并用ResultSet接受结果
            while(rs.next()){//遍历结构
                if (rs.getInt(1) > 0) { //判断用户是否存在，写入 相应的结果以响应请求
                    out.write("error");
                }else{
                    out.write("success");
                }
            }
            DataBase.closeConnection(conn, stmt, rs);//最后关闭 数据库连接释放资源
        } catch (Exception e) {
            // TODO Auto-generated catch block
            e.printStackTrace();
        }
    }

}

index.jsp：

 <%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTf-8" isELIgnored="false"%>
<!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=ISO-8859-1">
<script type="text/javascript" src="jquery.min.js"></script>
<title>Insert title here</title>
</head>
<body>
<h1>Bugzilla 测试页面</h1>

    <p>
        <h3>单击此按钮进行 Bugzilla WebService API 的XMLRPC调用测试：</h3>
        <input type="text" value="" name="username">
        <button onclick="checked()">超级简单的按钮</button>
    <p>

    <script type="text/javascript">
        function checked(){
            var name = $("[name='username']").val();
            $.ajax({
                url     :    "login.do",
                type    :    "POST",
                dataType:    "text",
                data    :    {username : name},
                success :    function (data){
                    if(data == "error"){
                        alert("用户已存在！");
                    }else if(data == "success"){
                        alert("用户名可以使用！");
                    }
                },error :   function(){
                    alert("程序异常！");
                }
            });
        }
    </script>
</body>
</html>

web.xml:


<web-app xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    xmlns:web="http://xmlns.jcp.org/xml/ns/javaee"
    xsi:schemaLocation="http://xmlns.jcp.org/xml/ns/javaee http://java.sun.com/xml/ns/javaee/web-app_2_5.xsd">
    <display-name>Archetype Created Web Application</display-name>
    <welcome-file-list>
        <welcome-file>index.jsp</welcome-file>
    </welcome-file-list>
</web-app>

不给代码 给你个思路吧 授人以鱼不如授人以渔
首先不管你是用hibernate还是mybatis 或者jdbc操作数据库的 你后台应该要有个按用户名查询的方法

然后 controller或者servlet有个方法是做验证的 调取根据用户名查询的方法 根据判断返回结果
最后 ajax的url应该指向这个contoller或者servlet的方法 记得带参数-输入的用户名

使用GET 或POST JQUERY 进行查询返回就可以了

我只求能展现ajax技术的代码，不管多基础多简单。我自己完善改进，45币

谁知道你的电脑行不行，以及你水平是否低到送到嘴边的肉都吃不进去。
最关键的，查不到你在csdn的信用，谁知道你会不会拿了代码就跑了。
可以给你写一个例子，包在我的计算机上能跑通。前提是你先采纳。

$.ajax({
method: 'get',
url: '检查接口',
timeout: 1000 * 60,
headers: {
},
data: {请求参数},
success: function (res) {

        if (res.success) {
             //do somthing
        }

        if (!res.success) {
            //do somthing
        }
    },
    error: function (err) {
        //do somthing
    }
});

使用GET 或POST JQUERY 进行查询返回就可以了

function loginValidate(){
var name = $("[name='username']").val();
$.ajax({
url : "loginCheck.do",
type : "POST",
dataType: "text",
data : {username : name},
success : function (data){
if(data == "error"){
alert("用户已存在！");
}else if(data == "success"){
alert("用户名可以使用！");
}
},error : function(){
alert("程序异常！");
}
});
}

js代码： var cn;
function checkUname(){
var uname=document.getElementById("uname").value;
document.getElementById("s1").innerHTML="";
if(uname==""){
document.getElementById("s1").innerHTML="用户名不能为空";
return false;
}else{
$.ajax(
{
url:"ua.do",
data:"uname="+uname,
dataType:"text",
success:function(data){
//alert(data);
$("#s1").html(data);
if(data!=""){
cn=false;
}
},
error:function(){alert('错了');}
}
);
}
return cn;
}

servlet 代码：

package servlet;

import java.io.IOException;
import java.io.PrintWriter;

import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import biz.IUsersBiz;
import biz.imp.Imp_UsersBiz;

public class UnameAjax extends HttpServlet{
/**
*
*/
private static final long serialVersionUID = 1L;

@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
        throws ServletException, IOException {
    req.setCharacterEncoding("utf-8");
    String uname=req.getParameter("uname");
    IUsersBiz iub=new Imp_UsersBiz();
    String str="";
    if(iub.checkUname(uname)){
        str="用户名已存在";
    }
    resp.setCharacterEncoding("utf-8");
    PrintWriter out=resp.getWriter();
    out.print(str);
    out.close();
}

@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
        throws ServletException, IOException {
    doGet(req, resp);
}

}