仿百度，谷歌输入框自动提示功能---JSON版，修复上一版的一个BUG
上个文章已经实现自动提示的功能，但是看过的童鞋们都知道我的交互使用XML做的，XML的传输是十分耗带宽的，用于我们这些做着玩的还可以，但是一旦数据量大起来他就相当的不给力了，所以我想使用JSON格式的数据传输，这样应该会好很多，说实话，之前知道有JSON，但是没学过啊，所以只好先学学JSON，至于JSON如何用我就不介绍了，大家网上搜搜到处都是，如果有什么搜不到的可以给我留言，虽然我不精通，但是基本使用还是能够应付的。
?
好了，言归正传，说说我们这次的主题，这次修复的BUG是什么呢？有童鞋发现了吗？，好吧，没发现也没关系，因为我自己也是这次才发现。那就是setTimeout()的问题，大家在服务器端加个打印输出一下，我们会发现时延并没有起到效果。好了，这次我就不上源码了，也不上图了，直接上修复过的代码，和使用JSON的部分。注意哦，要加上json.js，和一个JSON包，这个我打包给大家上传。
?
JS:
?
?
Servlet:
?
/** * @author :LYL *@date:2011-4-21,下午11:15:29 */package com.lyl.service;import java.io.IOException;import java.io.PrintWriter;import java.net.URLDecoder;import java.util.ArrayList;import java.util.List;import javax.servlet.ServletException;import javax.servlet.http.HttpServlet;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import javax.xml.parsers.DocumentBuilder;import javax.xml.parsers.DocumentBuilderFactory;import javax.xml.parsers.ParserConfigurationException;import net.sf.json.JSONArray;import org.w3c.dom.Document;import org.w3c.dom.Node;import org.w3c.dom.NodeList;import org.xml.sax.SAXException;public class Autocomplete extends HttpServlet {public void doPost(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException {response.setContentType("text/html");response.setCharacterEncoding("utf-8");PrintWriter out = response.getWriter();String path = request.getContextPath();String basePath = request.getScheme()+"://"+request.getServerName()+":"+request.getServerPort()+path+"/";String userword=URLDecoder.decode(request.getParameter("wordtext"),"utf-8");List<String> results=getResultList(userword, basePath);JSONArray ja=JSONArray.fromObject(results);out.println(ja.toString());out.flush();out.close();}/** * 获得匹配的字母，返回List类型 * @return */private static List<String> getResultList(String userword,String path){DocumentBuilderFactory dbf=DocumentBuilderFactory.newInstance();List<String> resultlist=new ArrayList<String>();try {DocumentBuilder db=dbf.newDocumentBuilder();Document document=db.parse(path+"/Words.xml");NodeList words=document.getElementsByTagName("word");int length=words.getLength();for(int i=0;i<length;i++){Node node=words.item(i);//获得字母String result=node.getFirstChild().getNodeValue();//这边进行一些逻辑处理，字符串的匹配，（后续工作）if(result.contains(userword)){resultlist.add(result);}}} catch (ParserConfigurationException e) {e.printStackTrace();} catch (SAXException e) {e.printStackTrace();} catch (IOException e) {e.printStackTrace();}return resultlist;}}?效果同样实现，大家可以修改试试，要引的包大家在下面下载：
?
1 楼 潘清山 2012-05-02 小弟:jquery不是很懂
哪个在输入框的视图在哪呢??
