jquery 按鍵盤上的enter事件
接下來我們使用Jquery實現(xiàn)回車鍵Enter切換焦點，此代碼在常用瀏覽器IE7， IE8， Firefox 3， Chrome 2 和 Safari 4測試通過。
使用的開發(fā)工具是微軟VS2010+Jquery框架
實現(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();
頁面初始化時，焦點定位第一個文本框內(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ā)生，而是切換焦點。另外一個相近的方法是stopPropagation，它起到阻止js事件冒泡的作用。
- 按Enter鍵觸發(fā)事件的jquery方法實現(xiàn)代碼
- jquery實現(xiàn)按Enter鍵觸發(fā)事件示例
- 基于jquery的button默認(rèn)enter事件(回車事件)。
- jQuery事件之鍵盤事件(ctrl+Enter回車鍵提交表單等)
- 修改jQuery.Autocomplete插件 支持中文輸入法 避免TAB、ENTER鍵失效、導(dǎo)致表單提交
- 基于Jquery的實現(xiàn)回車鍵Enter切換焦點
- Jquery利用mouseenter和mouseleave實現(xiàn)鼠標(biāo)經(jīng)過彈出層且可以點擊
- 基于Jquery的回車成tab焦點切換效果代碼(Enter To Tab )
- jQuery響應(yīng)enter鍵的實現(xiàn)思路
- jquery實現(xiàn)tab鍵進(jìn)行選擇后enter鍵觸發(fā)click行為
相關(guān)文章
Jquery 跨域訪問 Lightswitch OData Service的方法
修改lightswitch .server project web.config。添加如下內(nèi)容就可以實現(xiàn)對ApplicationData.svc/跨域訪問2013-09-09
jQuery選擇器_動力節(jié)點Java學(xué)院整理
選擇器是jQuery的核心，一個選擇器寫出來類似$('#dom-id')。下面給大家分享jQuery選擇器的相關(guān)知識，感興趣的朋友一起看看吧2017-07-07
easyui導(dǎo)出excel無法彈出下載框的快速解決方法
下面小編就為大家?guī)硪黄猠asyui導(dǎo)出excel無法彈出下載框的快速解決方法。小編覺得挺不錯的，現(xiàn)在就分享給大家，也給大家做個參考。一起跟隨小編過來看看吧2016-11-11
在一個頁面實現(xiàn)兩個zTree聯(lián)動的方法
最近發(fā)現(xiàn)項目中很多地方都是樹形菜單，而這些樹形菜單都是使用樹形插件zTree來制作的，下面這篇文章主要給大家介紹了關(guān)于在一個頁面實現(xiàn)兩個zTree聯(lián)動的相關(guān)資料，需要的朋友可以參考借鑒，下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧。2017-12-12
單選按鈕以及復(fù)選按鈕的使用情況還是蠻多的,多選按鈕使用toggleClass()方法就可以實現(xiàn)，下面小編給大家介紹單選按鈕的實現(xiàn)，感興趣的朋友一起看下吧2016-06-06
JS 遍歷 json 和 JQuery 遍歷json操作完整示例
這篇文章主要介紹了JS 遍歷 json 和 JQuery 遍歷json操作,結(jié)合完整實例形式詳細(xì)分析了JavaScript與jQuery遍歷json格式數(shù)據(jù)的簡單實現(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ū)Ш讲藛涡Ч麑崿F(xiàn)方法,可實現(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)不符合條件時，怎么跳出當(dāng)前循環(huán)，解決方法如下,需要的朋友可以參考下2014-06-06