jquery 按鍵盤上的enter事件
接下來我們使用Jquery實(shí)現(xiàn)回車鍵Enter切換焦點(diǎn)，此代碼在常用瀏覽器IE7， IE8， Firefox 3， Chrome 2 和 Safari 4測試通過。
使用的開發(fā)工具是微軟VS2010+Jquery框架
實(shí)現(xiàn)步驟如下
1、首先引用Jquery類庫
<script src="Scripts/jquery-1.4.1.min.js" type="text/javascript"></script>
2、Javascript代碼
<script type="text/javascript">
$(function () {
$('input:text:first').focus();
var $inp = $('input:text');
$inp.bind('keydown', function (e) {
var key = e.which;
if (key == 13) {
e.preventDefault();
var nxtIdx = $inp.index(this) + 1;
$(":input:text:eq(" + nxtIdx + ")").focus();
}
});
});
</script>
分析：
$('input:text:first').focus();
頁面初始化時(shí)，焦點(diǎn)定位第一個(gè)文本框內(nèi)
var $inp = $('input:text');
取的type=文本框的元素集合
$inp.bind('keydown', function (e) {}
給文本框集合綁定‘keydown'事件
var key = e.which;
取的當(dāng)前按下的鍵值 比如Enter的鍵值=13
e.preventDefault();
可以阻止它的默認(rèn)行為的發(fā)生而發(fā)生其他的事情，在這里我們組織PostBack發(fā)生，而是切換焦點(diǎn)。另外一個(gè)相近的方法是stopPropagation，它起到阻止js事件冒泡的作用。
- 按Enter鍵觸發(fā)事件的jquery方法實(shí)現(xiàn)代碼
- jquery實(shí)現(xiàn)按Enter鍵觸發(fā)事件示例
- 基于jquery的button默認(rèn)enter事件(回車事件)。
- jQuery事件之鍵盤事件(ctrl+Enter回車鍵提交表單等)
- 修改jQuery.Autocomplete插件 支持中文輸入法 避免TAB、ENTER鍵失效、導(dǎo)致表單提交
- 基于Jquery的實(shí)現(xiàn)回車鍵Enter切換焦點(diǎn)
- Jquery利用mouseenter和mouseleave實(shí)現(xiàn)鼠標(biāo)經(jīng)過彈出層且可以點(diǎn)擊
- 基于Jquery的回車成tab焦點(diǎn)切換效果代碼(Enter To Tab )
- jQuery響應(yīng)enter鍵的實(shí)現(xiàn)思路
- jquery實(shí)現(xiàn)tab鍵進(jìn)行選擇后enter鍵觸發(fā)click行為
相關(guān)文章
Jquery 跨域訪問 Lightswitch OData Service的方法
修改lightswitch .server project web.config。添加如下內(nèi)容就可以實(shí)現(xiàn)對ApplicationData.svc/跨域訪問2013-09-09
jQuery選擇器_動力節(jié)點(diǎn)Java學(xué)院整理
選擇器是jQuery的核心，一個(gè)選擇器寫出來類似$('#dom-id')。下面給大家分享jQuery選擇器的相關(guān)知識，感興趣的朋友一起看看吧2017-07-07
easyui導(dǎo)出excel無法彈出下載框的快速解決方法
下面小編就為大家?guī)硪黄猠asyui導(dǎo)出excel無法彈出下載框的快速解決方法。小編覺得挺不錯(cuò)的，現(xiàn)在就分享給大家，也給大家做個(gè)參考。一起跟隨小編過來看看吧2016-11-11
在一個(gè)頁面實(shí)現(xiàn)兩個(gè)zTree聯(lián)動的方法
最近發(fā)現(xiàn)項(xiàng)目中很多地方都是樹形菜單，而這些樹形菜單都是使用樹形插件zTree來制作的，下面這篇文章主要給大家介紹了關(guān)于在一個(gè)頁面實(shí)現(xiàn)兩個(gè)zTree聯(lián)動的相關(guān)資料，需要的朋友可以參考借鑒，下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-12-12
單選按鈕以及復(fù)選按鈕的使用情況還是蠻多的,多選按鈕使用toggleClass()方法就可以實(shí)現(xiàn)，下面小編給大家介紹單選按鈕的實(shí)現(xiàn)，感興趣的朋友一起看下吧2016-06-06
JS 遍歷 json 和 JQuery 遍歷json操作完整示例
這篇文章主要介紹了JS 遍歷 json 和 JQuery 遍歷json操作,結(jié)合完整實(shí)例形式詳細(xì)分析了JavaScript與jQuery遍歷json格式數(shù)據(jù)的簡單實(shí)現(xiàn)技巧,需要的朋友可以參考下2019-11-11
JQuery判斷正整數(shù)整理小結(jié)(jQuery 文本框中只能輸入正整數(shù))
這篇文章主要介紹了JQuery判斷正整數(shù)，附上詳細(xì)的代碼供大家查看具體的方法,需要的朋友可以參考下2017-08-08
jQuery1.6 使用方法1，想要學(xué)習(xí)jquery的朋友可以參考下。2011-11-11
jQuery縱向?qū)Ш讲藛涡Ч麑?shí)現(xiàn)方法
這篇文章主要介紹了jQuery縱向?qū)Ш讲藛涡Ч麑?shí)現(xiàn)方法,可實(shí)現(xiàn)類似淘寶首頁縱向菜單的顯示效果,涉及jQuery鼠標(biāo)響應(yīng)及頁面元素屬性動態(tài)操作相關(guān)技巧,需要的朋友可以參考下2016-12-12
jquery進(jìn)行數(shù)組遍歷如何跳出當(dāng)前的each循環(huán)
通過 jquery 的循環(huán)方法進(jìn)行數(shù)組遍歷，但是當(dāng)不符合條件時(shí)，怎么跳出當(dāng)前循環(huán)，解決方法如下,需要的朋友可以參考下2014-06-06