如何捕獲按鍵,例如Ctrl + Z,而不需要在JavaScript中的頁面上放置輸入元素?似乎在IE中,按鍵和鍵盤事件只能綁定到輸入元素(輸入框,文本區等)捕獲按鍵而不在頁面上放置輸入元素?
回答
jQuery的也有極好的實現,它是非常容易使用。這裏是你如何可以跨瀏覽器實現此功能:
$(document).keypress(function(e){
var checkWebkitandIE=(e.which==26 ? 1 : 0);
var checkMoz=(e.which==122 && e.ctrlKey ? 1 : 0);
if (checkWebkitandIE || checkMoz) $("body").append("<p>ctrl+z detected!</p>");
});
在IE7測試,火狐3.6.3 &的Chrome 4.1.249.1064
做的另一種方式,這是使用keydown事件和跟蹤事件。關鍵代碼。然而,由於歸一化的jQuery鍵碼,使用event.which則charCode,其規格建議在各種情況下使用event.which:
$(document).keydown(function(e){
if (e.keyCode==90 && e.ctrlKey)
$("body").append("<p>ctrl+z detected!</p>");
});
不知道e.which可以捕捉按鍵以及鼠標點擊!你能告訴我如何獲得鍵碼26嗎? – powerboy 2010-05-21 01:51:59
鍵碼26是由按鍵事件(指示CTRL + z)設置的「哪個」的特定ID。要查看keypress事件的更多字符映射,請查看[jQuery文檔](http://api.jquery.com/keypress/)或[unixpapa的關鍵事件測試器](http://unixpapa.com/js /testkey.html) – Trafalmadorian 2010-05-21 02:05:30
Thx。我知道鍵碼的含義。我的意思是,17是Ctrl,90是Z,那麼你是怎麼得到26號的?我只是google搜索,但無法找到答案。 – powerboy 2010-05-21 03:18:46
document.onkeydown = keyDown;
document.onkeypress = keyPress;
等在IE
對我的作品
你試過在IE6上,並嘗試過箭頭鍵嗎? – powerboy 2010-05-21 01:28:37
你不解釋'keyDown'和'keyPress'是什麼。這會引發錯誤。 – 2017-08-04 07:15:52
代碼&檢測CTRL + Z
document.onkeyup = function(e) {
if(e.ctrlKey && e.keyCode == 90) {
// ctrl+z pressed
}
}
對於非打印鍵,例如箭頭鍵和快捷鍵如Ctrl-Z ,Ctrl-x,Ctrl-c可能會在瀏覽器中觸發某些操作(例如,在可編輯的文檔或元素中),則在所有瀏覽器中可能不會發生按鍵事件。因此,如果您想要抑制瀏覽器的默認操作,則必須使用。如果沒有,keyup
也可以。
附加一個事件document
作品在所有主要瀏覽器:
document.onkeydown = function(evt) {
evt = evt || window.event;
if (evt.ctrlKey && evt.keyCode == 90) {
alert("Ctrl-Z");
}
};
對於一個完整的參考,我強烈建議Jan Wolter's article on JavaScript key handling。
檢測按鍵,包括組合鍵:這裏
window.addEventListener('keydown', function (e) {
if (e.ctrlKey && e.keyCode == 90) {
// Ctrl + z pressed
}
});
的好處是,你是不是覆蓋任何全局性,而是僅僅引入副作用。不好,但絕對比這裏的其他建議少得多。
對於現代的JS,請使用event.key
!
document.addEventListener("keypress", function onPress(event) {
if (event.key === "z" && event.ctrlKey) {
// Do something awesome
}
});
- 1. 捕獲一個輸入鍵在頁面上的任何位置按下
- 2. 如何捕獲鍵盤輸入而不寫在屏幕上
- 3. 捕獲頁面內的文本而不刷新輸入
- 4. 捕獲iPhone的按鍵輸入?
- 5. 從CComboBox捕獲輸入按鍵
- 6. 不縮放DIV元素,而縮放頁面
- 7. 在黑莓鍵盤上捕獲按鍵
- 8. jquery/Javascript - 捕獲頁面屏幕或元素的位置
- 9. 模擬按鍵而不瞄準元素?
- 10. 如何在頁面上隨機放置幾個元素?
- 11. 在頁面上居中放置可變大小的塊元素
- 12. 在輸入文本元素中按下「輸入」時停止頁面刷新
- 13. 如何把僞元素放在父元素的上面(和旁邊),而不影響父元素的位置
- 14. 在Android上捕獲PhoneGap上的按鍵
- 15. 在java面板中捕獲按鍵
- 16. 發送鍵到沒有輸入元素的頁面
- 17. Jinja2 html按鈕:在不同的頁面上捕獲POST
- 18. 使用watir-webdriver在頁面上打印輸入元素數組
- 19. 如何在頁面加載淡入元素,而不是「出現」?
- 20. 頁面上放置按鈕的問題
- 21. 使用按鍵和捕捉鍵獲得輸入值
- 22. 捕獲HTML文本輸入應用鍵後按鍵?
- 23. 在頁面上查找元素而不搜索整個文檔
- 24. 專注於頁面而不是元素
- 25. Google如何在頁面轉換時捕獲按鍵?
- 26. 從標準輸入捕獲字符而不等待輸入被按下
- 27. 捕獲所有頁面級錯誤,而不會打破頁面
- 28. 將html頁面的所有元素放入頁面的中心
- 29. 在iPad上進行方向更改後不正確的頁面元素放置
- 30. 放置在一起時頁面上的多個JQuery元素不起作用
你不應該需要。 – muhmuhten 2010-05-21 01:14:00
爲什麼不......? – 2010-05-21 08:28:10
@Tim:因爲當GUI元素沒有聚焦時按下這些按鍵組合將會非常規,因此違反了「最小驚喜原則」。 – 2011-07-24 18:15:32