jQuery處理鍵盤事件,比如小說網站中常見的按左右鍵來實現上一篇文章和下一篇文章,按ctrl+回車實現表單提交,google reader和有道閱讀中的全快捷鍵操作...
本文講述jQuery處理按鍵的原理和方法
jQuery處理鍵盤事件有三個函數,根據事件發生的順序分別是:
1 |
keydown(); |
2 |
keyup(); |
3 |
keypress(); |
keydown()
keydown事件會在鍵盤按下時觸發,可以在綁定的函數中歐能夠返回false來防止觸發瀏覽器的默認事件.
keyup()
keyup事件會在按鍵釋放時觸發,也就是你按下鍵盤起來后的事件
keypress()
keypress事件會在敲擊按鍵時觸發,我們可以理解為按下並抬起同一個按鍵
我們怎么才能獲取我按下的是A還是Z還是回車按鈕呢?
鍵盤事件可以傳遞一個參數event,其實說有的jQuery事件函數中都可以傳遞這么一個參數
1 |
$('input').keydown(function(event){ |
2 |
alert(event.keyCode); |
3 |
}); |
上面代碼中的,event.keyCode就可以幫助我們獲取到我們按下了什么按鍵,他返回的是ascII碼,比如說上下左右鍵,分別是38,40,37,39
如果我們要實現ctrl+Enter就是ctrl+回車提交表單
1 |
$(document).keypress(function(e) { |
2 |
if (e.ctrlKey && e.which == 13) |
3 |
$("form").submit(); |
4 |
}) |