当前位置:编程学习 > JAVA >>

ajax账号验证的问题

由于本人刚学ajax,是个菜鸟,恳请各位看下,使用mvc模式
显示页面
[code=jsp]<%@page contentType="text/html;charset=utf-8" import="com.zz.dao.*,java.util.*,com.zz.bean.*"%>
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">
<HTML>
<HEAD>
<TITLE>Untitled Page</TITLE>
<META http-equiv=Content-Type content="text/html; charset=utf-8">
<STYLE type=text/css> 
{
FONT-SIZE: 12px
}
.gridView {
BORDER-RIGHT: #bad6ec 1px; BORDER-TOP: #bad6ec 1px; BORDER-LEFT: #bad6ec 1px; COLOR: #566984; BORDER-BOTTOM: #bad6ec 1px; FONT-FAMILY: Courier New
}
.gridViewHeader {
BORDER-RIGHT: #bad6ec 1px solid; BORDER-TOP: #bad6ec 1px solid; BACKGROUND-IMAGE: url(../images/bg_th.gif); BORDER-LEFT: #bad6ec 1px solid; LINE-HEIGHT: 27px; BORDER-BOTTOM: #bad6ec 1px solid
}
.gridViewItem {
BORDER-RIGHT: #bad6ec 1px solid; BORDER-TOP: #bad6ec 1px solid; BORDER-LEFT: #bad6ec 1px solid; LINE-HEIGHT: 32px; BORDER-BOTTOM: #bad6ec 1px solid; TEXT-ALIGN: center
}
.cmdField {
BORDER-RIGHT: 0px; BORDER-TOP: 0px; BACKGROUND-IMAGE: url(../images/bg_rectbtn.png); OVERFLOW: hidden; BORDER-LEFT: 0px; WIDTH: 67px; COLOR: #364c6d; LINE-HEIGHT: 27px; BORDER-BOTTOM: 0px; BACKGROUND-REPEAT: repeat-x; HEIGHT: 27px; BACKGROUND-COLOR: transparent; TEXT-DECORATION: none
}
.buttonBlue {
BORDER-RIGHT: 0px; BORDER-TOP: 0px; BACKGROUND-IMAGE: url(../images/bg_button_blue.gif); BORDER-LEFT: 0px; WIDTH: 78px; COLOR: white; BORDER-BOTTOM: 0px; BACKGROUND-REPEAT: no-repeat; HEIGHT: 21px
}
</STYLE>
<META content="MSHTML 6.00.2900.5848" name=GENERATOR>
</HEAD>
<BODY 
style="BACKGROUND-POSITION-Y: -120px; BACKGROUND-IMAGE: url(../images/bg.gif); BACKGROUND-REPEAT: repeat-x">
<SCRIPT language="javascript">
 var xmlHttp;
 var flag;
 //创建XMLHttpRequest核心对象
 function createXMLHttp(){
 if(window.SMLHttpRequest){
 xmlHttp=new XMLHttpRequest();
 }else{
 xmlHttp=new ActiveXObject("Microsoft.XMLHTTP");
}
 }
 //建立xmlHttp核心对象
 function checkUsername(username){
 createXMLHttp();
 xmlHttp.open("POST","CheckServlet?username="+username");
 xmlHttp.onreadystatechange=checkUsernameCallback;
 xmlHttp.send(null);
 document.getElementById("msg").innerHTML="正在验证";
 }
 //定义回调函数
 function checkUsernameCallback(){
 if(xmlHttp.readyState==4){
 if(xmlHttp.status==200){
 var text=xmlHttp.responseText;
 if(text="true"){
                   flag=false;
                   document.getElementById("msg").innerHTML="用户名已注册";
 }else{
 flag="true";
 document.getElementById("msg").innerHTML="此用户名可用";
 }
 }
 }
 }
 function checkForm(){
       return flag;
     }
</SCRIPT>

<DIV>
  <TABLE height="100%" cellSpacing=0 cellPadding=0 width="100%" border=0>
    <TBODY>
      <TR style="BACKGROUND-IMAGE: url(../images/bg_header.gif); BACKGROUND-REPEAT: repeat-x"  height=47>
        <TD width=10><SPAN  style="FLOAT: left; BACKGROUND-IMAGE: url(../images/main_hl.gif); WIDTH: 15px; BACKGROUND-REPEAT: no-repeat; HEIGHT: 47px">
        </SPAN></TD>
        <TD>
        <SPAN style="FLOAT: left; BACKGROUND-IMAGE: url(../images/main_hl2.gif); WIDTH: 15px; BACKGROUND-REPEAT: no-repeat; HEIGHT: 47px"></SPAN>
        <SPAN style="PADDING-RIGHT: 10px; PADDING-LEFT: 10px; FLOAT: left; BACKGROUND-IMAGE: url(../images/main_hb.gif); PADDING-BOTTOM: 10px; COLOR: white; PADDING-TOP: 10px; BACKGROUND-REPEAT: repeat-x; HEIGHT: 47px; TEXT-ALIGN: center; 0px: ">添加用户 </SPAN>
        <SPAN  style="FLOAT: left; BACKGROUND-IMAGE: url(../images/main_hr.gif); WIDTH: 60px; BACKGROUND-REPEAT: no-repeat; HEIGHT: 47px"></SPAN></TD>
        <TD  style="BACKGROUND-POSITION: 50% bottom; BACKGROUND-IMAGE: url(../images/main_rc.gif)" width=10></TD>
      </TR>
      <TR>
        <TD style="BACKGROUND-IMAGE: url(../images/main_ls.gif)"> </TD>
        <TD style="PADDING-RIGHT: 10px; PADDING-LEFT: 10px; PADDING-BOTTOM: 10px; COLOR: #566984; PADDING-TOP: 10px; BACKGROUND-COLOR: white" vAlign=top align=middle>
          <DIV>
            <TABLE class=gridView id=ctl00_ContentPlaceHolder2_GridView1 style="WIDTH: 100%; BORDER-COLLAPSE: collapse" cellSpacing=0 rules=all  border=1>

            <form action="addUser" method="post" onsubmit="return checkForm()">
            <hr/>
       <table align="center">
      <tr><td>账号:</td><td><input type="text" name="username" onblur="checkUsername(this.value)"/><span id="msg"></span></td></tr>
      <tr><td>密码:</td><td><input type="password" name="password" /></td></tr>
      <tr><td>性别:</td><td><input type="radio" name="sex" value="male">男<input type="radio" name="sex" value="female">女</td></tr>
      <tr><td>电话:</td><td><input type="text" name="tel"/></td></tr>
      <tr><td>地址:</td><td><input type="text" name="address"/></td></tr>
      <tr><td><input type="submit" value="提交"></td><td><input type="reset" value="取消" onClick="window.location.href='UserInfo.jsp'"/></td></tr>
      </table>
     </form>
            </TABLE>
          </DIV>
        </TD>
        <TD style="BACKGROUND-IMAGE: url(../images/main_rs.gif)"></TD>
      </TR>
      <TR style="BACKGROUND-IMAGE: url(../images/main_fs.gif); BACKGROUND-REPEAT: repeat-x"  height=10>
        <TD style="BACKGROUND-IMAGE: url(../images/main_lf.gif)"></TD>
        <TD style="BACKGROUND-IMAGE: url(../images/main_fs.gif)"></TD>
        <TD style="BACKGROUND-IMAGE: url(../images/main_rf.gif)"></TD>
      </TR>
    </TBODY>
  </TABLE>
</DIV>
</BODY>
</HTML>
[/code]
验证页面(这里只是验证用户名是否存在的代码)
package com.zz.servlet;

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

import javax.resource.cci.ResultSet;
import javax.servlet.ServletException;
import javax.servlet.http.HttpServlet;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;

import com.zz.db.DBOperator;

public class CheckServlet extends HttpServlet {

@Override
protected void doGet(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
req.setCharacterEncoding("utf-8");
resp.setContentType("text/html");
String username=req.getParameter("username");
PrintWriter out=resp.getWriter();
Connection conn=DBOperator.getConn();
String sql="select count(username) from user where username=?";
try {
PreparedStatement pstmt=conn.prepareStatement(sql);
pstmt.setString(1, username);
ResultSet rs=(ResultSet) pstmt.executeQuery();
if(rs.next()){
if(rs.getInt(1)>0){
out.print("true");
}else{
out.print("false");
}
}
out.close();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}finally{
try {
conn.close();
} catch (SQLException e) {
// TODO Auto-generated catch block
e.printStackTrace();
}
}
}

@Override
protected void doPost(HttpServletRequest req, HttpServletResponse resp)
throws ServletException, IOException {
// TODO Auto-generated method stub
doGet(req, resp);
}

}

配置文件
   
<servlet>
    <servlet-name>CheckServlet</servlet-name>
    <servlet-class>com.zz.servlet.CheckServlet</servlet-class>
  </servlet>
  <servlet-mapping>
    <servlet-name>CheckServlet</servlet-name>
    <url-pattern>/CheckServlet</url-pattern>
  </servlet-mapping>
--------------------编程问答-------------------- 你得说明什么问题? --------------------编程问答-------------------- 楼主是要做什么? 不懂。。
至于所说的mvc 谈不上!
--------------------编程问答-------------------- --------------------编程问答--------------------
引用 1 楼 fengxing_2 的回复:
你得说明什么问题?
在注册时输入完用户名进行验证该用户名是否存在,不存在则提示已被注册,反之则是可用,可以继续下一步。 --------------------编程问答--------------------
引用 2 楼 liu4626846 的回复:
楼主是要做什么? 不懂。。
至于所说的mvc 谈不上!
在注册时输入完用户名进行验证该用户名是否存在,不存在则提示已被注册,反之则是可用,可以继续下一步。 --------------------编程问答--------------------
引用 2 楼 liu4626846 的回复:
楼主是要做什么? 不懂。。
至于所说的mvc 谈不上!
至于MVC可以不管现在,只要实现那个验证功能就可以了 --------------------编程问答-------------------- 用jquery中的$get,不要用原生的ajax。 --------------------编程问答-------------------- 自己debug一下很快就解决了嘛,首先确定是不是可以进入servlet ,然后确定servlet是否正确执行,再看回调能不能正确显示。
ps.用jquery多好呀 --------------------编程问答-------------------- 你的servlet里面要响应一个值给jsp页面,你把你要传给Jsp页面的返回值out.print()试试.还有搞个jquery的文档看下ajax的请求 ,比这种方法清晰不少....
补充:Java ,  Web 开发
CopyRight © 2012 站长网 编程知识问答 www.zzzyk.com All Rights Reserved
部份技术文章来自网络,