如何实现类似如在CSDN里提问的时候的程序、

我想在一个text中输入一个编号，输入完之后它会自动到数据库中去选择它的编号所对于的员工姓名，并显示出来。 比如： 我在text框中输入： 02039，这个时候就会自动在网页上显示：“王刚”这个名字，如果这个名字不存在的话，则马上会提示错误。 实现这个程序是不能点击任何提交按钮的，一在text中输入则自动检查。 这个怎么做？ 谢谢了。

解决方案 »

  1.   

    http://www.java3z.com/cwbwebhome/article/article5/5551.html?id=805
      

  2.   

    这个简单呀，有两种方法，一种是在焦点失去的事件里提交请求，去数据库查询数据。
    二种方法是用AJAX异步发请求，去数据库查询数据，这样看起来页面没有刷新。
      

  3.   

    Ajax（Asynchronous JavaScript and XML）是一个结合了Java技术、XML、以及JavaScript的web开发模式，可以让你构建基于Java技术的Web应用。这是一种很简单的模式，但是却解决了web开发中经常碰到的页面重载问题（即不需要页面刷新便可轻易实现服务器端数据的获取），很实用，推荐给大家。       本例中的应用是基于java的Servlet技术(也可以很容易的扩展到bean中实现)，共需要创建三个文件: index.jsp    AjaxUse.java    web.xml      本文是通过一个Button按钮来触发客户端的sendData()方法向服务器发送数据,如果需要实现过一个固定时间默认向服务器发送数据,可以在javascript代码中加入定时器:setInterval("sendData()",1000),定时器单位为毫秒.文中代码已测试通过，希望对各位有用 ---------------index.jsp文件代码<%@ page contentType="text/html;charset=GB2312"%>
    <html>
    <title>Ajax应用</title>
    <head>
    <script language="javascript">
    var req;
    function sendData() {
       var idField = document.getElementById("userid");
       var url = "servlet/AjaxUse?id=" + escape(idField.value);
       waitMessage();
       if (window.XMLHttpRequest) {
           req = new XMLHttpRequest();
       } else if (window.ActiveXObject) {
           req = new ActiveXObject("Microsoft.XMLHTTP");
       }
       req.open("GET", url, true);
    //open包含5个参数:(http-method, url, async, userID, password) 前三个是必要的，后两个是可选的
    //----http-method： HTTP的通信方式，比如GET或是 POST 
    //----url： 接收XML数据的服务器的URL地址。通常在URL中要指明 ASP或CGI程序
    //----async： 布尔标识.如是异步通信方式(true)，客户机不等待服务器的响应；如是同步方式(false)，客户机就要等到服务器返回消息后才去执行其他操作
    //----userID: 用户ID，用于服务器身份验证
    //----password 用户密码，用于服务器身份验证
       req.onreadystatechange = callback;
    //如用POST方法，需添加如下内容
    //----req.setRequestHeader("Content-Type", "application/x-www-form-urlencoded");
    //----req.send("id=" + escape(idField.value));
       req.send(null);
    }
    function callback() {
        if (req.readyState == 4) {
    //XMLHTTP对象中的readyState属性能够反映出服务器在处理请求时的进展状况
    //----0 Response对象已经创建，但XML文档上载过程尚未结束
    //----1 XML文档已经装载完毕
    //----2 XML文档已经装载完毕，正在处理中
    //----3 部分XML文档已经解析
    //----4 文档已经解析完毕，客户端可以接受返回消息
            if (req.status == 200) {
    //检查是否成功接收了服务器响应
                 parseMessage();
            }
        }
    }
    function parseMessage() {
       var message = req.responseXML.getElementsByTagName("data");
       var str=new Array();
       if(message.length>=1){
           for(var i=0;i<message.length;i++){
              str[i]=message[i].firstChild.data;
           }
       }else{
          str[0]=message.length;
       }
        mdiv = document.getElementById("userIdMessage");
        mdiv.innerHTML = "<div>"+str[0]+"</div>";
    }
    function waitMessage() {
        mdiv = document.getElementById("userIdMessage");
        mdiv.innerHTML = "<div>请稍后----</div>";
    }
    </script>
    </head>
    <body bgcolor=silver>
    <font size=2>输入一个数字，通过ajax将会在页面静态获取服务器端响应：</font>
    <input type="text" name="id" id="userid" size="20">
    <input type="button" value="发送" onclick="sendData()">
    <div id="userIdMessage"></div>
    </body>
    </html>---------------AjaxUse.java  文件代码package com.servlet;import javax.servlet.*;
    import javax.servlet.http.*;public class AjaxUse extends HttpServlet {
        private ServletContext context;
        public void init(ServletConfig config) throws ServletException {
            this.context = config.getServletContext();
        }
        public void doGet(HttpServletRequest request, HttpServletResponse  response)
            throws IOException, ServletException {
            String targetId = request.getParameter("id");
            StringBuffer sb=new StringBuffer("<message>");
            response.setContentType("text/xml");
            response.setHeader("Cache-Control", "no-cache");
            sb.append("<data>"+targetId+"</data><data>ShenYang</data>");
            sb.append("</message>");
            PrintWriter out=response.getWriter();
            out.write(sb.toString());
            out.close(); 
             }
        }
    }---------------web.xml  文件代码<?xml version="1.0" encoding="UTF-8"?>
    <!DOCTYPE web-app PUBLIC "-//Sun Microsystems, Inc.//DTD Web Application 2.3//EN" "http://java.sun.com/dtd/web-app_2_3.dtd">
    <web-app>
      <servlet>
        <servlet-name>AjaxUse</servlet-name>
        <servlet-class>com.servlet.AjaxUse</servlet-class>
      </servlet>
       <servlet-mapping>
            <servlet-name>AjaxUse</servlet-name>
            <url-pattern>/servlet/AjaxUse</url-pattern>
        </servlet-mapping>
    </web-app>
      

  4.   

    AJAX最好的选择~无刷新的
    客户感觉也很好.