自动补全

1.获取服务端url路径
2.向服务端设置数据
3.设置回调函数

$.post("news.company?method=doSupplement",{textField:inputField.val()},
    function(data){
	var result = new Array();
	if(data.length > 0){
	    result = data.split(",");
	    setUl(result);
	   }
    });

4.服务端进行处理。返回值

public String doSupplement(HttpServletRequest request, HttpServletResponse response)throws ServletException, IOException{
	String title = request.getParameter("textField").trim();
	String result = "";
	PrintWriter out = response.getWriter();
	if(title.length() > 0){
		result = productManager.query(title);		        
if(result.length()>0){									result = result.substring(0,result.length()-1);	
    }
	out.println(result);
	return "supplement";
}

public String query(String productName){
	Connection connection = databaseConnection.createConnection();
	PreparedStatement preparedStatement = null;
	ResultSet rs = null;
	String sql = "select name from product where name like '"+productName+"%'";
	StringBuffer stringBuffer = new StringBuffer();
	int index = 1;
	try {
		preparedStatement = connection.prepareStatement(sql);
		rs = preparedStatement.executeQuery();
		while(rs.next()){
			stringBuffer.append(rs.getString(index)).append(",");
		}
	} catch (SQLException e) {
	} finally {
		databaseConnection.closeAll(rs, preparedStatement,connection);
	}
	return stringBuffer.toString();
	}

5.客户端的回调函数得到返回值进行拆分，保存到数组中
在回调函数中

6.循环数组，包裹一个<li>标签，添加click事件。
7。移入时设置样式

function setUl(array){
	clear();	
	div.addClass("show");
	for(var i=0;i<array.length;i++)
		ul.append($("<li>"+array[i]+"</li>"));
		ul.find("li").click(function(){//设置事件
		inputField.val($(this).text());
		clear();
	}).hover(//设置样式
		function(){$(this).addClass("mouseOver");},
		function(){$(this).removeClass("mouseOver");}
	);
}