js自定义快捷，IE,FF有良好的支持

作者：xling 来源：xling的BLOG 时间：2007-08-25 17:34:00　

这不是什么原创，是我跟据OReilly.JavaScript.The.Definitive.Guide.5th.Edition.Aug.2006中的例子修改的。

现在有几个问题：

IE，FF下控制的很好，

Opera下，不会把系统快捷键给屏蔽掉。
Safari下，如果你按下的是系统快捷键，就不会响应给自定程序。
CTRL+S不是safari的快捷键，可以看ctrl+s可以响应，ctrl+a,ctrl+d等，就得不到

水平有限，暂时（也可能永远）找不到解决办法。

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/1999/xhtml"><head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /><title>js自定义快捷，IE,FF有良好的支持 - asp之家</title><script language="javascript" type="text/javascript">/*--------------------------------------------------------Opera下，不会把系统快捷键给屏蔽掉。Safari下，如果你按下的是系统快捷键，就不会响应给自定程序。CTRL+S不是safari的快捷键，可以看ctrl+s可以响应，ctrl+a,ctrl+d等，就得不到响应。---------------------------------------------------------*/function Browser(){ var d_ = document,n_ = navigator,t_ = this,s_= screen; var b = n_.appName; var ua = n_.userAgent.toLowerCase(); t_.name = "Unknow"; t_.safari = ua.indexOf("safari")>-1; // always check for safari & opera t_.opera = ua.indexOf("opera")>-1; // before ns or ie t_.firefox = !t_.safari && ua.indexOf('firefox')>-1; // check for gecko engine t_.ns = !t_.firefox && !t_.opera && !t_.safari && (b=="Netscape"); t_.ie = !t_.opera && (b=="Microsoft Internet Explorer"); t_.name = (t_.ie ? "IE" : (t_.firefox ? "Firefox" : (t_.ns ? "Netscape" : (t_.opera ? "Opera" : (t_.safari ? "Safari" : "Unknow")))));}function JShortCut(){ var self; var map = {}; var brw = new Browser(); this.bind = function(sc,func,doSysSc){ map[sc] = func; if(doSysSc === false) map[sc].doSysShortCut = false; } this.unBind = function(sc){ delete map[sc]; } this.listen = function(elm){ if(typeof elm == "string") elm = document.getElementById(elm); if (elm.addEventListener) { //Safari,opera,firefox elm.addEventListener("keydown", dispatch, false); elm.addEventListener("keypress", dispatch, false); } else if (elm.attachEvent) { //IE elm.attachEvent("onkeydown", dispatch); elm.attachEvent("onkeypress", dispatch); } else { elm.onkeydown = element.onkeypress = dispatch; } } var dispatch = function (evt){ evt = evt || event; if (evt.type == "keydown") { var code = evt.keyCode; if (code == 16 || code == 17 || code == 18) return; keyname = JShortCut.KEYS[code]; var modifiers = ""; if (!keyname && (evt.altKey || evt.ctrlKey)) keyname = Keymap.keyCodeToPrintableChar[code]; if (keyname) { if (evt.altKey) modifiers += "alt_"; if (evt.ctrlKey) modifiers += "ctrl_"; if (evt.shiftKey) modifiers += "shift_"; }else{ return; } }else if (evt.type == "keypress") { if (evt.altKey || evt.ctrlKey) return; if (evt.charCode != undefined && evt.charCode == 0) return; var code = evt.charCode || evt.keyCode; keyname=String.fromCharCode(code); var lowercase = keyname.toLowerCase( ); if (keyname != lowercase) { keyname = lowercase; // Use the lowercase form of the name modifiers = "shift_"; // and add the shift modifier. } } var shortCut = modifiers+keyname; var target = evt.srcElement || evt.target; var func = map[shortCut]; if(typeof func == "function"){ func(target,shortCut,evt); if(func.doSysShortCut === false){ switch(brw.name){ case "IE": evt.returnValue = false; evt.keyCode = 0; break; case "Firefox": evt.preventDefault(); break; case "Opera": evt.returnValue = false; evt.preventDefault(); break; case "Safari": evt.preventDefault(); evt.returnValue = false; //for(o in evt) // document.write(o," ",typeof(eval("evt." + o))," = ",eval("evt." + o),"<br />"); } } } //return false; }}JShortCut.KEYS = { 48:"0", 49:"1", 50:"2", 51:"3", 52:"4", 53:"5", 54:"6", 55:"7", 56:"8", 57:"9", 59:";", 61:"=", 65:"a", 66:"b", 67:"c", 68:"d", 69:"e", 70:"f", 71:"g", 72:"h", 73:"i", 74:"j", 75:"k", 76:"l", 77:"m", 78:"n", 79:"o", 80:"p", 81:"q", 82:"r", 83:"s", 84:"t", 85:"u", 86:"v", 87:"w", 88:"x", 89:"y", 90:"z", 107:"+", 109:"-", 110:".", 188:",", 190:".", 191:"/", 192:"'", 219:"[", 220:"\\", 221:"]", 222:"\"", 8:"backspace", 9:"tab", 13:"return", 19:"pause", 27:"escape", 32:"space", 33:"pageup", 34:"pagedown", 35:"end", 36:"home", 37:"left", 38:"up", 39:"right", 40:"down", 44:"printscreen", 45:"insert", 46:"delete", 112:"f1", 113:"f2", 114:"f3", 115:"f4", 116:"f5", 117:"f6", 118:"f7", 119:"f8", 120:"f9", 121:"f10", 122:"f11", 123:"f12", 144:"numlock", 145:"scrolllock" };</script></head><body><div id="aa"></div><p>Opera下，不会把系统快捷键给屏蔽掉。<br /> Safari下，如果你按下的是系统快捷键，就不会响应给自定程序。<br />CTRL+S不是safari的快捷键，可以看ctrl+s可以响应，ctrl+a,ctrl+d等，就得不到响应。</p><p>function doSys(target,shortCut,evt){<br /> document.getElementById("aa").innerHTML = shortCut;<br /> }</p><p>var sc = new JShortCut();<br /> sc.bind("ctrl_a",doSys,false);<br /> sc.bind("ctrl_n",doSys,false);<br /> sc.bind("ctrl_p",doSys,false);<br /> sc.bind("ctrl_o",doSys,false);<br /> sc.bind("ctrl_s",doSys,false);<br /> sc.bind("ctrl_w",doSys,false);<br /> sc.bind("alt_f4",doSys,false);<br /> sc.bind("ctrl_f",doSys,false);<br /> sc.bind("ctrl_y",doSys,false);<br /> sc.bind("f1",doSys,false);<br /> sc.bind("f5",doSys,false);<br /> sc.bind("a",doSys);<br /> sc.listen(document);</p></body></html><script language="javascript" type="text/javascript">function doSys(target,shortCut,evt){ document.getElementById("aa").innerHTML = shortCut;}var sc = new JShortCut();sc.bind("ctrl_a",doSys,false);sc.bind("ctrl_n",doSys,false);sc.bind("ctrl_p",doSys,false);sc.bind("ctrl_o",doSys,false);sc.bind("ctrl_s",doSys,false);sc.bind("ctrl_w",doSys,false);sc.bind("alt_f4",doSys,false);sc.bind("ctrl_f",doSys,false);sc.bind("ctrl_y",doSys,false);sc.bind("f1",doSys,false);sc.bind("f5",doSys,false);sc.bind("a",doSys);sc.listen(document);</script>

标签：js,快捷键

投稿

js自定义快捷，IE,FF有良好的支持

猜你喜欢

AJAX缓存问题的两种解决方法(IE)

如何跨浏览器使用连续字符的换行

Window.Open详解

javascript trim、left、right等函数，兼容IE,FireFox

Oracle8i和Microsoft SQL Server比较

SQL Server与Oracle、DB2的优劣对比

改善登陆界面的用户体验: 自动聚焦表单

使用DW中遇到的常见问题详解

解决Dreamweaver不支持中文文件名

asp智能脏话过滤系统v1.0

SQL Server中通过扩展存储过程实现数据库的远程备份与恢复

XML卷之实战锦囊（1）：动态排序

asp开发Wap中的随笔

谈谈设计师的发展

图片自适应宽度新解决方法

提高MySQL数据库查询效率的三个实用技巧

检测你的SQL Server是否有特洛伊木马

怎样开启phpStudy服务器

定位后无法选择容器内容解决方案

对学好网页设计很有价值的一句话