jquery.autocomplete修改實(shí)現(xiàn)鍵盤上下鍵自動(dòng)填充示例
更新時(shí)間：2013年11月19日 17:10:29 作者：
根據(jù)需求要實(shí)現(xiàn)通過(guò)鍵盤上下移動(dòng)，獲得聯(lián)想菜單中的值，如同google baidu的查詢功能，下面的代碼是自己手寫(xiě)的，喜歡的朋友可以嘗試操作下
根據(jù)需求要實(shí)現(xiàn)通過(guò)鍵盤上下移動(dòng)，獲得聯(lián)想菜單中的值，如同google baidu的查詢功能。
在網(wǎng)上找了很久沒(méi)有找到可以實(shí)現(xiàn)該功能的插件，無(wú)奈只能自己動(dòng)手改代碼。
找到j(luò)s中的KEY.DOWN 和 KEY.UP執(zhí)行代碼
如下：
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);
這樣加好后，上下鍵時(shí)輸入框里會(huì)有相應(yīng)的值，但是聯(lián)想鍵盤上的光標(biāo)卻不見(jiàn)了。
找到select.next(); 代碼的定義
next: function() {
moveSelect(1);
},
加入一個(gè)類似的方法
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;
這樣就可以了。
================================
非常感謝原作者，
加入一個(gè)類似的方法
stay: function() {
moveSelect(1);
},后發(fā)現(xiàn)點(diǎn)擊上下鍵，是隔行移動(dòng)，所以改為：
stay: function() {
moveSelect(0);
},
在網(wǎng)上找了很久沒(méi)有找到可以實(shí)現(xiàn)該功能的插件，無(wú)奈只能自己動(dòng)手改代碼。
找到j(luò)s中的KEY.DOWN 和 KEY.UP執(zhí)行代碼
如下：
復(fù)制代碼 代碼如下:
case KEY.DOWN:
event.preventDefault();
if ( select.visible() ) {
select.next();
}
else {
onChange(0, true);
}
break;
在select.next();后加入
復(fù)制代碼 代碼如下:
var selected = select.selected();
var v = selected.result;
$input.val(v);
這樣加好后，上下鍵時(shí)輸入框里會(huì)有相應(yīng)的值，但是聯(lián)想鍵盤上的光標(biāo)卻不見(jiàn)了。
找到select.next(); 代碼的定義
復(fù)制代碼 代碼如下:
next: function() {
moveSelect(1);
},
加入一個(gè)類似的方法
復(fù)制代碼 代碼如下:
stay: function() {
moveSelect(1);
},
然后
復(fù)制代碼 代碼如下:
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;
這樣就可以了。
================================
非常感謝原作者，
加入一個(gè)類似的方法
復(fù)制代碼 代碼如下:
stay: function() {
moveSelect(1);
},后發(fā)現(xiàn)點(diǎn)擊上下鍵，是隔行移動(dòng)，所以改為：
stay: function() {
moveSelect(0);
},
相關(guān)文章
jQuery實(shí)現(xiàn)常見(jiàn)的隱藏與展示列表效果示例
這篇文章主要介紹了jQuery實(shí)現(xiàn)常見(jiàn)的隱藏與展示列表效果,結(jié)合完整實(shí)例形式分析了jQuery事件響應(yīng)及針對(duì)頁(yè)面元素屬性動(dòng)態(tài)操作相關(guān)實(shí)現(xiàn)技巧,需要的朋友可以參考下2018-06-06
jQuery實(shí)現(xiàn)級(jí)聯(lián)菜單效果(仿淘寶首頁(yè)菜單動(dòng)畫(huà))
今天我們就帶大家體會(huì)一下級(jí)聯(lián)菜單的顯示，只是實(shí)現(xiàn)了簡(jiǎn)單的效果，不過(guò)大都原理是一樣的2014-04-04
這篇文章主要為大家詳細(xì)介紹了jQuery Masonry瀑布流布局神器的使用方法，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2017-05-05
jquery實(shí)現(xiàn)的一個(gè)導(dǎo)航滾動(dòng)效果具體代碼
首頁(yè)有一個(gè)導(dǎo)航頁(yè)面要實(shí)現(xiàn)滾動(dòng)效果，索性就仿造別人的效果自己做了一個(gè)，大體上還行，看起來(lái)還是比較流暢的,現(xiàn)滾動(dòng)效果，腳本代碼如下，感興趣的朋友可以參考下2013-05-05
這篇文章主要為大家詳細(xì)介紹了jQuery實(shí)現(xiàn)彈幕效果案例，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價(jià)值，感興趣的小伙伴們可以參考一下2021-08-08
這篇文章主要介紹了用模版生成HTML的的框架jquery.tmpl使用詳解,需要的朋友可以參考下2015-01-01
比較常用的限制字符輸入數(shù)功能(比如熱火超天的微博輸入框),用jQuery和原生JavaScript分別寫(xiě)了一個(gè).原生JavaScript注釋中有區(qū)分中英文字符的函數(shù), 但個(gè)人并不建議這么做.2010-09-09
ff下JQuery無(wú)法監(jiān)聽(tīng)input的keyup事件的解決方法
這篇文章主要介紹了ff下JQuery無(wú)法監(jiān)聽(tīng)input的keyup事件的解決方法。需要的朋友可以過(guò)來(lái)參考下，希望對(duì)大家有所幫助2013-12-12
jQuery創(chuàng)建插件的代碼分析，需要的朋友可以參考下。2011-04-04
風(fēng)雲(yún)初次編寫(xiě)插件，望高手指點(diǎn)，基于jquery的checkbox下拉框插件2010-06-06