博一博

千言万语也无法详尽的描述ajax的魅力，那就先下水试试吧（临渊羡鱼，不如退而结网）

下面就结合这样一个案例来体验一下，需求是：用ajax实现网站用户唯一性校验。描述如下：

1.打开一个网站页面，输入用户名，点击校验按钮。

2.系统收到信息后进行比较判断，如果存在，则在当前页面提示“用户帐户信息已存在”，否则，提示“用户帐户可用”。

这里，客户端就要用到ajax，服务器我们用Servlet来实现。

首先，设计一个html页面,命名为accountCheck.html,具体代码见附件
其中,页面上有一个输入框,名称叫做accountNo,在输入框的旁边有一个div标签,它是做什么的呢?对了,它就是用于动态的显示我们的提示信息用的.按照web开发的原理,要想触发实践,在我们的实例中必须在按钮上加上onclick事件触发动作,而当单击事件发生后,则去执行我们的js函数checkAccount()(是不是弱智了点啊,觉得土的话,接着往下看,下面就是传说中的javascript)

够你看的了吧,慢慢看,每一个函数都有详细的注释,希望你能成为ajax高手.

哦,你已经看懂了吗?如果看懂了,把如上代码copy到accountCheck.html的标签之内,至此客户端的代码已经ok.

接下来,我们再来看看服务器端代码如何编写,前文已经说过,服务器端我们用Servlet来实现.具体代码如下:

public void doGet(HttpServletRequest request, HttpServletResponse response)
   throws ServletException, IOException {
  doPost(request,response);
 }

 /**
  * The doPost method of the servlet.

  *
  * This method is called when a form has its tag value method equals to post.
  *
  * @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 doPost(HttpServletRequest request, HttpServletResponse response)
   throws ServletException, IOException {
  //获取客户端请求帐户数据
  String accountNo = request.getParameter("account");
  //如果输出信息中包含中文信息,则需要设置字符集编码为gb2312
  //否则,客户端收到的信息将会是乱码
  response.setContentType("text/html;charset=gb2312");
  //设置响应报文头,使浏览器不做数据缓存
  response.setHeader("Cache-Control","no-cache");
  PrintWriter out = response.getWriter();
  if("zhangsan".equalsIgnoreCase(accountNo)){
   out.println("用户帐户信息已存在");
  }else{
   out.println("用户帐户可用");
  }
  //信息输出完成后,关闭输出流
  out.close();
 }

OK,现在我们终于可以歇口气来看看我们的成果啦.我将本文的全部代码以附件的形式附上,望大家测试评判!