网页里的快捷键

解决思路: 先给链接定义快捷键,然后在用户按下快捷键时捕捉其按键,判断文档中聚集的对象是否为链接,是否按下Alt键,除Alt外另一键是否与激活链接的快捷设置一致,都是的话就在新窗口中打开链接。 具体步骤
代码示例: 1.先给链接设置快捷键。
<a href="http://www.flash8.net" accessKey="F">闪吧</a> <a href="http://www.blueidea.com" accessKey="B">经典</a> <a href="http://www.5d.cn" accessKey="5">5D</a>
2.因为 accessKey 的作用仅仅是聚集到链接对象,不会自动打开链接,需要对按钮事件进行判断处理。
document.onkeyup=function(){       //松开按钮时触发函数 obj=document.activeElement    //捕获文档中当前激活的对象  //打开链接的条件:对象必须为链接、Alt键和链接的快捷键同时被按下 if(obj.tagName=="A"&&event.altKey&&String.fromCharCode(event.keyCode)==obj.accessKey.toUpperCase())                          window.open(obj.href,obj.target)          //开新窗口打开链接地址 }
3.完整代码。
<script> document.onkeyup=function(){       //松开按钮时触发函数 obj=document.activeElement    //捕获文档中当前激活的对象  //打开链接的条件:对象必须为链接、Alt键和链接的快捷键同时被按下 if(obj.tagName=="A"&&event.altKey&&String.fromCharCode(event.keyCode)==obj.accessKey.toUpperCase())                          window.open(obj.href,obj.target) //根据原链接的target打开链接地址 } </script> <a href="http://www.flash8.net" accessKey="F">闪吧</a> <a href="http://www.blueidea.com" accessKey="B">经典</a> <a href="http://www.5d.cn" accessKey="5">5D</a>
注意:obj.tagName=="A" 中的 A 必须大写。 技巧:window.open(obj.href,obj.target) 可以改为 obj.click()。 试一试:读者可以试着让所有按快捷键触发的链接都在一个固定的名为 link 的窗口中打开。 特别提示 运行代码,依次按 Alt+F、Alt+B和Alt+5,将分别打开三个链接。

特别说明

本例代码虽然简单,但涉及到的知识点比较多。先是设置链接的快捷键,然后捕获按键事件,在按键事件触发的函数中取得当前被激活的对象,并该对象是否为链接,而且Alt和该链接对象的中设置快捷键被按下,是则打开链接地址。 1.event.altKey 设置或获取 Alt 键的状态 2.event.keyCode 设置或获取与导致事件的按键关联的 Unicode 按键代码 3.String.fromCharCode([code1[, code2[, ...[, codeN]]]]) 从一些 Unicode 字符值中返回一个字符串 4.obj.accessKey 返回对象的快捷键值 5.String.toUpperCase() 返回一个字符串,该字符串中的所有字母都被转化为大写字母

posted @ 2013-07-10 17:14  王亚卿  阅读(323)  评论(0编辑  收藏  举报