ajax实现在注册时检测用户名是否注册过。

AJAX不是一种新的编程语言，而是一种用于创建更好更快以及交互性更强的 Web 应用程序的技术。使用javascript向服务器提出请求并处理响应而不阻塞用户！核心对象XMLHTTPRequest。通过这个对象，您的 JavaScript 可在不重载页面的情况与Web服务器交换数据。AJAX 在浏览器与 Web 服务器之间使用异步数据传输（HTTP 请求），这样就可使网页从服务器请求少量的信息，而不是整个页面。

说白了其实ajax就是通过JavaScript中得核心对象XMLHTTPRequest来实现的功能，下面我的实现时基于jquery的实现。

jsp页面部分如下：

<s:form action="/user/register.do" method="post" enctype="multipart/form-data">
    		<h3 style="display: inline;">

			用户名:<input type="text" name="username" id="username" size="25" maxlength="20" />

		</h3>
    		<h5 style="display: inline;" id="message"></h5><br>
    		<h5 style="color: red;">(大小不要超过20个字符)</h5>
    		
    		<h3 style="display: inline;">

			密 码:<input type="password" name="password" id="password" size="25" maxlength="20"/>

		</h3><br>
    		<h5 style="color: red;">(大小不要超过20个字符)</h5>
    		
       		<h3 style="display: inline;">

			用户图像:<s:file name="userimage" id="userimage" size="25" οnblur="imagecheck()"/>

		</h3>
       		<h3 style="display: inline;" id="image"></h3><br/></br></br>
       		
    		<h3 style="display: inline;">

			用户等级:<input style="background-color: silver;" type="text" name="userlevel" size="25"  readonly="true" value="普通用户"/>

		</h3><br>
    		<h5 style="color: red;">(默认为普通会员,会员评级方式点<a href="/book_shops/introduceOfUserLevel.jsp"><font color="blue">这里</font></a>)</h5>
    		
		<h3 style="display: inline;">

			用户账户:<input style="background-color: silver;;" type="text" name="useraccount" size="25"  readonly="true" value="1"/>

		</h3>
		<h5 style="color: red;">(请注册后去个人中心充值)</h5>
			
        	<s:submit value="提交"  οnclick="return registercheck()" ></s:submit>
        	<span style=word-spacing:25px>  </span>
		<s:reset value="重置"></s:reset><br/>
    	</s:form>

同时定义的JavaScript的有关代码如下：

*通过ajax来验证用户名的js 
 */
$(window).load(function(){
        var url="/book_shops/user/ajaxregister.do";
        $("#username").blur(function(){
        	if($("#username").val().length==0){
        		$("#message").css("color","red");
        		$("#message").html("(请输入用户名)");
                $("#message").focus();
        	}else{
        		  var name=$("#username").val();
                  //alert(name);
                  var param={userName:name};
                  //alert(param.userName);
                  //alert(param);
                  $.post(url,param,function(data){
                      //alert(data);data的值是{type:'yes',show:'（该用户名已被使用）'}
                      eval("json="+data);//运行后json={type:'yes',show:'（该用户名已被使用）'},所以json是自己定义的。
                      //alert(json.type);
                          if(json.type=='no'){
                                  $("#message").css("color","green");
                                  $("#message").html(json.show);
                          }
                          if(json.type=='yes'){
                        	  	  $("#message").css("color","red");
                                  $("#message").html(json.show);
                                  $("#message").focus();
                          }
                   
                  });
        	}
                    
        });
});

同时后台的action如下：

package edu.rxb.action.user;

import java.io.IOException;
import java.io.PrintWriter;
import java.util.ArrayList;
import java.util.List;

import javax.servlet.http.HttpServletResponse;
import org.apache.struts2.ServletActionContext;

import com.opensymphony.xwork2.ActionSupport;

import edu.rxb.dao.user.UserInfoDao;
import edu.rxb.dao.user.UserLoginDao;
import edu.rxb.model.Users;

public class AjaxRegister extends ActionSupport {
	private String userName = null;
	private String message = null;
	/* (non-Javadoc)
	 * @see com.opensymphony.xwork2.ActionSupport#execute()
	 */
	@Override
	public String execute() throws Exception {
		// TO/DO Auto-generated method stub
		userName = ('u'+ServletActionContext.getRequest().getParameter("userName")).trim();
		//System.out.println(userName);
		UserLoginDao userLoginDao = new UserLoginDao();
		if(userLoginDao.check_name(userName)){
			//System.out.println("已注册");
			//message="{\"type\":\"yes\", \"show\":\"(用户名不可用)\"}";
			message = "{type:'yes',show:'（该用户名已被使用）'}";
			
		}else{
			//System.out.println("可用");
			//message="{\"type\":\"no\", \"show\":\"(用户名可用)\"}";
			message = "{type:'no',show:'（该用户名可以使用）'}";
		}
		PrintWriter writer;
		HttpServletResponse httpServletResponse = ServletActionContext.getResponse();
        try {
        	httpServletResponse.setContentType("text/html;charset=UTF-8");
            writer = httpServletResponse.getWriter();
            writer.write(message);
            writer.flush();
            writer.close();
        } catch (IOException e) {
            e.printStackTrace();
        }
		
		return "checkname";
	}

	public String getMessge() {
		return message;
	}

	public void setMessge(String message) {
		this.message = message;
	}

	public String getUserName() {
		return userName;
	}

	public void setUserName(String userName) {
		this.userName = userName;
	}

	public String getMessage() {
		return message;
	}

	public void setMessage(String message) {
		this.message = message;
	}
	
}

操作访问数据的dao就没写了，就是简单的操作数据库。

这些就实现了简单的在注册时查看用户名是否已注册，并在页面提示。