繁体   English   中英

超链接的键盘快捷键(jQuery)

[英]Keyboard shortcut for hyperlink (jQuery)

我的网页上有六个链接(没有其他内容),我想给每个链接编号,1到6.如果没有ctrl和alt等,客户端点击相应的数字键会很不错。

这是可能的,使用jquery或其他html脚本的最佳方法是什么?

这是jQuery的一个版本:

$(document).ready(function() {
   $("body").keypress(function(event) {
    var link = "#link";
      if(event.keyCode == 49) link += 1;
      if(event.keyCode == 50) link += 2;
      if(event.keyCode == 51) link += 3;
      if(event.keyCode == 52) link += 4;
      if(event.keyCode == 53) link += 5;
      if(event.keyCode == 54) link += 6;

      if(link != "#link") $(link).trigger("click");
   });
});

如果你想在没有alt或ctrl键的情况下这样做,你需要使用JavaScript。 您可以将事件列表器附加到html或body标签,并侦听按键事件。 不要使用复杂的“if”语句,这是不必要的。 它可以像这样优雅(使用jQuery):

<a href="http://domain1.com" code="1">link1</a>
<a href="http://domain2.com" code="2">link2</a>
etc

$('body').keypress(function(e) {
  $('[code=' + String.fromCharCode(e.keyCode-48) + ']').click();
});

使用ctrl / alt键,您可以使用accesskey html属性: http//reference.sitepoint.com/html/a/accesskey

没有control + key :查询中的keypress事件监听器,并且每个按钮监听一个特定的密钥代码。

使用control + key :您可以使用访问密钥( http://www.cs.tut.fi/~jkorpela/forms/accesskey.html

$('body').bind('keypress', function(e) {
    if(e.keyCode==49){ // number 1 on the keyboard been pressed
        $('firstHref').click();
    } else if(e.keyCode==50) { // number 2
        $('secondHref').click();
    } else if(e.keyCode==51) { // number 3
        $('thirdHref').click();
    }else if(e.keyCode==52) { // number 4
        $('fourthHref').click();
    }else if(e.keyCode==53) { // number 5
        $('fiveHref').click();
    }else if(e.keyCode==54) { // number 6
        $('sixHref').click();
    }
});

您可以尝试这样的事情: 链接 (单击运行按钮,然后在点击麻木键之前单击“结果”框内部。

$('body').bind('keypress', function(e) {
    if(e.keyCode==49){ // 1
                alert('1 key pressed');
     window.location = "http://www.stackoverflow.com/"                
    }
    if(e.keyCode==50){ // 2
                alert('2 key pressed');
       window.location = "http://jsfiddle.net/"               
    }
    if(e.keyCode==51){ // 3
                alert('3 key pressed');
       window.location = "http://www.google.com/"                 
    }
    if(e.keyCode==52){ // 4
                alert('4 key pressed');
      window.location = "http://www.stackoverflow.com/"                  
    }
    if(e.keyCode==53){ // 5
                alert('5 key pressed');
      window.location = "http://jsfiddle.net/"                  
    }
    if(e.keyCode==54){ // 6
                alert('6 key pressed');
       window.location = "http://www.google.com/"                 
    }
});​

暂无
暂无

声明:本站的技术帖子网页,遵循CC BY-SA 4.0协议,如果您需要转载,请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM