开发者

jQuery keyboard navigation breaks on Firefox

The following code reveals a div on a keypress event of '?' (191). Works perfectly with Google Chrome but refuses to work with Firefox. Any ideas?

$(document).keyup(function (e) {
  if(e.which == 16) isShift=false; }).keydown(function (e) {

  if(e.which == 16) isShift=true;

  if(e.which == 191 && isShift == true) {
    if ($('#keyboard-shortcut-menu').css('display') == 'none') {
      $('#keyboard-shortcut-menu').show();
    } else {
      $('#keyboard开发者_运维问答-shortcut-menu').hide();
    }

  return false;
}

UPDATE: Figured this one out. Firefox captures '?' char as 0 value. Check out my answer below.


try with

e.keyCode == XX

oh, and you can use e.shiftKey to test if "shift" key is pressed

$(document).keypress(function(e){
  if(e.keyCode==191 && e.shiftKey)
    $('#keyboard-shortcut-menu').toggle();
  return false;
});


i think you were missing a ; or } cos this works in FF:

$(function(){
    $(document).keyup(function (e) {
          if(e.which == 16) isShift=false;
    }).keydown(function (e) {

          if(e.which == 16) isShift=true;

          if(e.which == 191 && isShift == true) {
                if ($('#keyboard-shortcut-menu').css('display') == 'none') {
                      $('#keyboard-shortcut-menu').show();
                }
                  else {
                      $('#keyboard-shortcut-menu').hide();
                }

              return false;
            }
      });
  });

try the js fiddle here: http://jsfiddle.net/q3d6S/1/


Try this (demo):

$(document).keyup(function(e){
    if (e.which == 191 && e.shiftKey == true) {
        $('#keyboard-shortcut-menu').toggle();
    }
});


Okay, I got it. I ran this script on Firefox console:

$(document).keydown(function(e) {
  console.log(e.which);
});

It seems Firefox captures the '?' char as value 0, while Google Chrome captures it as 191.

Solved it by adding a conditional code:

if((e.which == 191 && isShift == true) || (e.which == 0 && isShift == true))

Thanks for all the refactoring tips.

0

上一篇:

下一篇:

精彩评论

暂无评论...
验证码 换一张
取 消

最新问答

问答排行榜