用于浏览网站的键盘快捷键

时间:2011-01-08 09:01:03

标签: cross-browser navigation keyboard-shortcuts

我正在构建一个PHP应用程序框架,其中所有页面都是动态创建的,例如:

  • domain.com/1 /
  • domain.com/2 /
  • domain.com/3 /
  • 等...

现在我想添加支持,以便用户只需使用键盘浏览网站即可。 (可能按键盘键)

这是可行的吗?如果是这样,我需要使用什么?

1 个答案:

答案 0 :(得分:1)

您肯定需要使用JavaScript来捕获所有 keydown (注意,箭头键不会触发 keypress 事件)事件。例如, Ctrl + 2 将转到/ 2页面, Ctrl + 3 会转到/ 3页。

我认为你需要一种方法将按键事件映射到实际的页面名称。我建议在keydown事件代码和实际页面名称之间维护一个抽象层,例如映射文件,以便将来可以根据需要自定义密钥代码。

搜索此活动以帮助您入门。以下示例捕获回车键

   if(event.keyCode == 13) {
       // do stuff
   }

以下是密钥代码列表: http://www.cambiaresearch.com/c4/702b8cd1-e5b0-42e6-83ac-25f0306e3e25/Javascript-Char-Codes-Key-Codes.aspx

要为这些键创建事件,我建议首先为它们创建事件。您将需要jQuery用于此示例,尽管有很多方法可以在纯JavaScript中实现相同的功能:

// bind keydown events to the window
$(document).keydown(function(event) {
    if (event.which == 37) {  
       // left arrow - run your code to change back a page
       alert('left');
    } else if(event.which == '39') {
       // right arrow - run code to move forward a page
       alert('right');
    }
 });

浏览器和密钥的关键事件表: http://www.quirksmode.org/js/keys.html

关键代码列表: http://www.cambiaresearch.com/c4/702b8cd1-e5b0-42e6-83ac-25f0306e3e25/Javascript-Char-Codes-Key-Codes.aspx