管理资源吧首页>>>教程>>>编程>>>JavaScript教程>>>

jquery.autocomplete修改实现键盘上下键自动填充示例

　　根据需求要实现通过键盘上下移动，获得联想菜单中的值，如同google baidu的查询功能。

　　在网上找了很久没有找到可以实现该功能的插件，无奈只能自己动手改代码。

　　找到js中的KEY.DOWN 和 KEY.UP执行代码

　　如下：

　　

复制代码 代码如下:

　　case KEY.DOWN:

　　event.preventDefault();

　　if ( select.visible() ) {

　　select.next();

　　}

　　else {

　　onChange(0, true);

　　}

　　break;

　　在select.next();后加入

　　

复制代码 代码如下:

　　var selected = select.selected();

　　var v = selected.result;

　　$input.val(v);

　　这样加好后，上下键时输入框里会有相应的值，但是联想键盘上的光标却不见了。

　　找到select.next(); 代码的定义

　　

复制代码 代码如下:

　　next: function() {

　　moveSelect(1);

　　},

　　加入一个类似的方法

　　

复制代码 代码如下:

　　stay: function() {

　　moveSelect(1);

　　},

　　然后

　　

复制代码 代码如下:

　　case KEY.DOWN:

　　event.preventDefault();

　　if ( select.visible() ) {

　　select.next();

　　var selected = select.selected();

　　var v = selected.result;

　　$input.val(v);

　　select.stay();

　　}

　　else {

　　onChange(0, true);

　　}

　　break;

　　这样就可以了。

　　================================

　　非常感谢原作者，

　　加入一个类似的方法

　　

复制代码 代码如下:

　　stay: function() {

　　moveSelect(1);

　　},后发现点击上下键，是隔行移动，所以改为：

　　stay: function() {

　　moveSelect(0);

　　},

教程首页 更多教程