Input框的智能提示下拉层功能

下面我们来实现如图所示的功能。


第一步：首先我们先在html文件中简单的布个局如下图：



在input框下面还需要建立一个下拉框的布局，将下拉框隐藏掉


实现的静态效果是如下图所示：



这样已经初步有了一点效果，但这只是静态的，下面我们来实现静态的效果，实现这个效果我们需要了解js,jQ的用法。
 我们先建一个数据库，里面存放着我们的数据
1、首先我们要引入jQ代码库<script type="text/javascript" src="./jquery-1.8.3.min.js"></script>之后我们就可以利用jQ框架来实现效果
2、我们要对input框绑定一个键盘按下keyup事件




3、将获取的到的关键字发送到后台控制器中
在后台进行模糊查询


后台处理之后在前台进行下图步骤处理





最终就可以的到本文章最初的效果。