在java Web中如何用Ajax实现用户名已存在
展开全部
我给你做一个例子：希望能帮到你。
实现的功能：注册页面上当输入“lixin”时，显示该用户已被注册。其他的名称无所谓。希望能帮到你。欢迎追问。
一个简单的jsp页面：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" language="javascript">
//根据浏览器的不同创建不同的XMLHttpRequest
function createXmlHttpRequest(){
var xmlreq=false;
if(window.XMLHttpRequest){
xmlreq=new XMLHttpRequest();
}else if(window.ActiveXobject){
try{
xmlreq = new ActiveXobject("Msxm12.XMLHTTP");
}catch(e1){
try{
xmlreq = new ActiveXobject("Miscoft.XMLHTTP");
}catch(e2){
}
}
}
return xmlreq;
}
//
function usernameCheck(){
var username = document.all.username.value;//获得text的值
var request = createXmlHttpRequest();//创建request的对象
request.open("post","servlet/ValidationServlet?username="+username);
request.send();
request.onreadystatechange = function(){
if(request.readyState==4&request.status==200)
{
var value = request.responseText;
if(value=="true"){
document.all.unc.innerHTML="该用户名已经被注册";}
}else{
document.all.unc.innerHTML="该用户可以注册";
}
}}
</script>
</head>
<body>
用户姓名：<input type ="text" name="username" onblur="usernameCheck()" /><font color="red" size="-1" id="unc"></font>
<br>
用户密码：<input type ="password" name= "userpw" />
</body>
</html>
用到的Servlet：
package sample;
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;
public class ValidationServlet extends HttpServlet {
/**
* The doGet method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to get.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html");
String username = request.getParameter("username");
if(username.equals("lixin")){
response.getWriter().print("true");}
else{
response.getWriter().print("false");
}
}
}
实现的功能：注册页面上当输入“lixin”时，显示该用户已被注册。其他的名称无所谓。希望能帮到你。欢迎追问。
一个简单的jsp页面：
<%@ page language="java" import="java.util.*" pageEncoding="utf-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'index.jsp' starting page</title>
<!--
<link rel="stylesheet" type="text/css" href="styles.css">
-->
<script type="text/javascript" language="javascript">
//根据浏览器的不同创建不同的XMLHttpRequest
function createXmlHttpRequest(){
var xmlreq=false;
if(window.XMLHttpRequest){
xmlreq=new XMLHttpRequest();
}else if(window.ActiveXobject){
try{
xmlreq = new ActiveXobject("Msxm12.XMLHTTP");
}catch(e1){
try{
xmlreq = new ActiveXobject("Miscoft.XMLHTTP");
}catch(e2){
}
}
}
return xmlreq;
}
//
function usernameCheck(){
var username = document.all.username.value;//获得text的值
var request = createXmlHttpRequest();//创建request的对象
request.open("post","servlet/ValidationServlet?username="+username);
request.send();
request.onreadystatechange = function(){
if(request.readyState==4&request.status==200)
{
var value = request.responseText;
if(value=="true"){
document.all.unc.innerHTML="该用户名已经被注册";}
}else{
document.all.unc.innerHTML="该用户可以注册";
}
}}
</script>
</head>
<body>
用户姓名：<input type ="text" name="username" onblur="usernameCheck()" /><font color="red" size="-1" id="unc"></font>
<br>
用户密码：<input type ="password" name= "userpw" />
</body>
</html>
用到的Servlet：
package sample;
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;
public class ValidationServlet extends HttpServlet {
/**
* The doGet method of the servlet. <br>
*
* This method is called when a form has its tag value method equals to get.
*
* @param request the request send by the client to the server
* @param response the response send by the server to the client
* @throws ServletException if an error occurred
* @throws IOException if an error occurred
*/
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
this.doPost(request, response);
}
public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException {
response.setContentType("text/html");
String username = request.getParameter("username");
if(username.equals("lixin")){
response.getWriter().print("true");}
else{
response.getWriter().print("false");
}
}
}
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
初学者??这些是我学java一年才开始学的东西,这些东西太多了,都只能说一下思路,写代码,太长,要写好几百行,你写一个dao方法,按照用户名从数据库查询,如果不为空则就是用户名存在,反之不存在,既然你是初学者,我用其他快捷的方式完成了你也看不懂,最基础的太长,我不想写,所以你还是在网上找些例子看着学习吧,别人完成的毕竟没有自己完成的理解深刻
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
数据库操作类(mysql数据库)1.import java.sql.Connection;
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;public class BaseDao{
protected Connection conn;
protected Statement sta;
protected ResultSet rs;
protected PreparedStatement ps;
public void setConnection(){
try {
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/dianlv";
conn = DriverManager.getConnection(url,"root","root");
} catch (ClassNotFoundException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
public void closeAll(){
try{
if(rs!=null){
rs.close();
}if(ps!=null){
ps.close();
}if(sta!=null){
sta.close();
}if(conn!=null){
conn.close();
}
}catch(SQLException e){
e.printStackTrace();
}
}
}
2.UserDao类集成baseDao类，实现对数据库中的数据名字超找：import java.sql.SQLException;public class UserDao extends BaseDao {
/**
* 验证用户名是否成功；如果成功了返回true；
*
* **/
public boolean checkUserName(String userName){
boolean flag = false;
this.setConnection();
String sql ="select * from users where userName = ?";
try {
ps = conn.prepareStatement(sql);
ps.setString(1,userName);
rs = ps.executeQuery();
if(rs.next()){
flag = true;
}
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return flag;
}3.上面代码实现应该有一个user实体：创建user实体类：public class User {
private String userName;
private int id;
private String password;
public String getUserName() {
return userName;
}
public void setUserName(String userName) {
this.userName = userName;
}
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
4.写一个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 com.fz.dao.UserDao;public class CheckUserNameServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { doPost(request, response);
} public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { request.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
5:jsp页面用于用户的操作，上面用到ajax技术用户验证用户名是否重复<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'Login.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
function checkUnique(){
var content = $('#userName').val(); //获取文本框中输入的内容
var url = 'servlet/CheckUserNameServlet';
$.post(
url, //处理请求的url
{'name':content}, //传递的参数
function(data){ //请求处理完毕之后的回调函数
if(data == 'true'){//返回的是字符串不能用data = false这样比较
$("#s1").text("用户名不唯一");```````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````
}else if(data == 'false'){
$("#s1").text("用户名可用");
}
}
);
}
</script> </head>
<body>
<% request.setCharacterEncoding("utf-8");
%>
<form action="">
用户名：<input type="text" name="uerName" onblur="checkUnique();" id = "userName"/> <span id="s1"></span><br/>
密码：<input type="password" name="password" /><br/>
<input type="submit" value="提交"/>
</form>
</body>
</html>
String userName = request.getParameter("userName");
if(userName!=null && !userName.isEmpty()){
UserDao dao = new UserDao();
boolean b = dao.checkUserName(userName);
PrintWriter out = response.getWriter();
out.print(b);
out.flush();
out.close();
}
}}
注意把jquery的jar报引到项目下，使用jquery方式实现ajax。
import java.sql.DriverManager;
import java.sql.PreparedStatement;
import java.sql.ResultSet;
import java.sql.SQLException;
import java.sql.Statement;public class BaseDao{
protected Connection conn;
protected Statement sta;
protected ResultSet rs;
protected PreparedStatement ps;
public void setConnection(){
try {
Class.forName("com.mysql.jdbc.Driver");
String url = "jdbc:mysql://localhost:3306/dianlv";
conn = DriverManager.getConnection(url,"root","root");
} catch (ClassNotFoundException e) {
// TODO Auto-generated catch block
e.printStackTrace();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
public void closeAll(){
try{
if(rs!=null){
rs.close();
}if(ps!=null){
ps.close();
}if(sta!=null){
sta.close();
}if(conn!=null){
conn.close();
}
}catch(SQLException e){
e.printStackTrace();
}
}
}
2.UserDao类集成baseDao类，实现对数据库中的数据名字超找：import java.sql.SQLException;public class UserDao extends BaseDao {
/**
* 验证用户名是否成功；如果成功了返回true；
*
* **/
public boolean checkUserName(String userName){
boolean flag = false;
this.setConnection();
String sql ="select * from users where userName = ?";
try {
ps = conn.prepareStatement(sql);
ps.setString(1,userName);
rs = ps.executeQuery();
if(rs.next()){
flag = true;
}
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
return flag;
}3.上面代码实现应该有一个user实体：创建user实体类：public class User {
private String userName;
private int id;
private String password;
public String getUserName() {
return userName;
}
public void setUserName(String userName) {
this.userName = userName;
}
public int getId() {
return id;
}
public void setId(int id) {
this.id = id;
}
public String getPassword() {
return password;
}
public void setPassword(String password) {
this.password = password;
}
}
4.写一个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 com.fz.dao.UserDao;public class CheckUserNameServlet extends HttpServlet {
public void doGet(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { doPost(request, response);
} public void doPost(HttpServletRequest request, HttpServletResponse response)
throws ServletException, IOException { request.setCharacterEncoding("utf-8");
response.setContentType("text/html;charset=utf-8");
5:jsp页面用于用户的操作，上面用到ajax技术用户验证用户名是否重复<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>
<%
String path = request.getContextPath();
String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";
%><!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<base href="<%=basePath%>">
<title>My JSP 'Login.jsp' starting page</title>
<meta http-equiv="pragma" content="no-cache">
<meta http-equiv="cache-control" content="no-cache">
<meta http-equiv="expires" content="0">
<meta http-equiv="keywords" content="keyword1,keyword2,keyword3">
<meta http-equiv="description" content="This is my page">
<script type="text/javascript" src="js/jquery-1.7.1.min.js"></script>
<script type="text/javascript">
function checkUnique(){
var content = $('#userName').val(); //获取文本框中输入的内容
var url = 'servlet/CheckUserNameServlet';
$.post(
url, //处理请求的url
{'name':content}, //传递的参数
function(data){ //请求处理完毕之后的回调函数
if(data == 'true'){//返回的是字符串不能用data = false这样比较
$("#s1").text("用户名不唯一");```````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````````
}else if(data == 'false'){
$("#s1").text("用户名可用");
}
}
);
}
</script> </head>
<body>
<% request.setCharacterEncoding("utf-8");
%>
<form action="">
用户名：<input type="text" name="uerName" onblur="checkUnique();" id = "userName"/> <span id="s1"></span><br/>
密码：<input type="password" name="password" /><br/>
<input type="submit" value="提交"/>
</form>
</body>
</html>
String userName = request.getParameter("userName");
if(userName!=null && !userName.isEmpty()){
UserDao dao = new UserDao();
boolean b = dao.checkUserName(userName);
PrintWriter out = response.getWriter();
out.print(b);
out.flush();
out.close();
}
}}
注意把jquery的jar报引到项目下，使用jquery方式实现ajax。
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
你这不是不会。是一点都不会？
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（2）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
