jquery 实现输入字符给出建议列表&实现上下键切换选项

输入框键入字符时给出建议列表

1、html 一个 input(输入框) 与 ul(建议列表) 的组合
2、监听输入框的内容“oninput()”,根据内容给出建议列表展示
3、建议列表 要做强大一些,建议使用AJax访问一个内容丰富的接口

以上是简单的任务分解,实现起来比较简单的

输入框监听上下键且切换选项

1、监听输入框的按键keydown事件
2、判断上(e.keyCode:38)下(e.keyCode:40)键的值,并分别执行相应的函数UP 与 DWON, 默认选中第i个li
3、不管是UP 还是DOWN 函数都是改变列表的选中项,其实就是改变li标签的背景色且将值赋给输入框
4、若执行UP函数,把suggest[++i]的值赋给input框,也可以给该项添加背景色
5、若为DOWN函数,把suggest[–i]的值赋给input框,也可以给该项添加背景色
6、注意执行到第一项和最后一项的时候,i的值默认为-1 ,DWON时i++,应该定位到首项(i=0);默认值为-1时,UP时i–,也应该定位到(i=0)上

if (i < 0 || i >= suggent.length) {
    i = 0;
}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值