js事件綁定快捷鍵以ctrl+k為例

更新時間：2014年09月30日 15:50:36 投稿：whsnow

js為快捷鍵綁定事件，當按這個快捷鍵時就會觸發(fā)事先綁定處理函數(shù)，下面以ctrl+k為例與大家分享下具體的實現(xiàn)代碼

js代碼

<html> 
<head> 
<script type="text/javascript"> 
window.onload=function(){ 
HotKeyHandler.Init(); 
} 
var HotKeyHandler={ 
currentMainKey:null, 
currentValueKey:null, 
Init:function(){ 
HotKeyHandler.Register(0,"K",function(){alert("注冊成功");}); 
}, 
Register:function(tag,value,func){ 
var MainKey=""; 
switch(tag){ 
case 0: 
MainKey=17; //Ctrl 
break; 
case 1: 
MainKey=16; //Shift 
break; 
case 2: 
MainKey="18"; //Alt 
break; 
} 
document.onkeyup=function(e){ 
HotKeyHandler.currentMainKey=null; 
} 

document.onkeydown=function(event){ 
//獲取鍵值 
var keyCode= event.keyCode ; 
var keyValue = String.fromCharCode(event.keyCode); 

if(HotKeyHandler.currentMainKey!=null){ 
if(keyValue==value){ 
HotKeyHandler.currentMainKey=null; 
if(func!=null)func(); 
} 
} 
if(keyCode==MainKey) 
HotKeyHandler.currentMainKey=keyCode; 
} 
} 
} 
</script> 
</head> 
<body> 
測試，按下ctrl+k你就會發(fā)現(xiàn)神奇的事情發(fā)生了 
</body> 
</html>

您可能感興趣的文章:

使用smartupload組件實現(xiàn)jsp+jdbc上傳下載文件實例解析
這篇文章主要介紹了使用smartupload組件實現(xiàn)jsp+jdbc上傳下載文件實例解析,非常不錯，具有參考借鑒價值，需要的朋友可以參考下
2017-01-01
基于JS實現(xiàn)飛機大戰(zhàn)游戲的示例代碼
這篇文章主要為大家詳細介紹了如何利用JS實現(xiàn)飛機大戰(zhàn)游戲，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2022-06-06
JS移動端/H5同時選擇多張圖片上傳并使用canvas壓縮圖片
這篇文章主要介紹了JS移動端/H5同時選擇多張圖片上傳并使用canvas壓縮圖片,需要的朋友可以參考下
2017-06-06
addEventListener 的用法示例介紹
這篇文章主要介紹了addEventListener 的用法,需要的朋友可以參考下
2014-05-05
JavaScript Typescript基礎使用教程
TypeScript是Microsoft（微軟）開發(fā)的一種開源編程語言，它充分利用了JavaScript原有的對象模型，并在此基礎上進行了擴充，TypeScript設計目標是開發(fā)大型應用，它可以編譯成純JavaScript，編譯出來的JavaScript可以運行在任何一種JS運行環(huán)境中
2022-12-12
javascript獲取元素偏移量的方法有哪些
javascript中可以通過四個屬性獲得元素的偏移量，offsetHeight、offsetWidth、offsetLeft、offsetTop，下面為大家解釋下各屬性的含義
2014-06-06
深入分析下javascript中的[]()+!
本文是筆者遇到的一個很無奈的題目之后，不得不仔細研究一番，有需要的小伙伴來參考下吧。
2015-07-07
如何在JavaScript中運行.NET?Core代碼詳情
這篇文章主要介紹了在JavaScript中運行.NET?Core代碼詳情，DotNetJS可以將C#項目編譯為與任何環(huán)境兼容的單文件JavaScript庫，變可以在JavaScript中運行.NET?Core代碼，相關操作分享詳情，需要的小伙伴可以參考一下
2022-04-04
詳解webpack打包后如何調(diào)試的方法步驟
這篇文章主要介紹了詳解webpack打包后如何調(diào)試的方法步驟,小編覺得挺不錯的，現(xiàn)在分享給大家，也給大家做個參考。一起跟隨小編過來看看吧
2018-11-11
js實現(xiàn)飛入星星特效代碼
這篇文章主要介紹了js實現(xiàn)飛入星星特效代碼,主要通過控制背景與飛入點的樣式,結(jié)合setTimeout函數(shù)即可實現(xiàn)星星飛入的效果,對于學習javascript有不錯的參考借鑒價值,需要的朋友可以參考下
2014-10-10