ajax 如何实现搜索输入框联想功能

作者的个人分享网：分享时刻【www.itison.cn】

ajax是如何实现搜索输入框联想功能的，以下是一个简单的示例

jsp代码和jQeury代码中，直接连接ajaxLenovo.jsp即可，divLns.jsp用于显示联想结果下拉列表。
ajaxLenovo.jsp代码如下：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>









	
输入框联想搜索功能
	请输入：
	

divLns.jsp代码如下：

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@ taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c" %>









	

		
			
${uname }
		
	

控制器中servlet中的处理是利用模糊查询的方式查询出与输入相关的结果，返回给前端页面divLns.jsp，代码如下：

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

		response.setContentType("text/html;charset=uft-8");
		request.setCharacterEncoding("utf-8");
		response.setCharacterEncoding("utf-8");
		
		String uname = request.getParameter("uname");
		
		UserService userService = new UserServiceImpl();
		List unamesList = userService.searchByName(uname);
		
		request.setAttribute("unames", unamesList);
		request.getRequestDispatcher("divLns.jsp").forward(request, response);
	}

测试结果如下：