Question

我为mozilla的“shift key”keydown和keyup事件编写了一个代码片段，但它没有按照我的预期工作。代码：

<html>
<head>
<title>Testing Page</title>
<script type="text/javascript">
var key_capslock = 0;
var key_shift = 0;

function print1(){ window.alert("shift status" + key_shift);}
function print2(){ window.alert("shift status" + key_shift);}
function keyset(evt){
  evt.preventDefault();
  if(evt.keyCode == 16){
     if(key_shift == 0 ){key_shift = 1; evt.stopPropagation();}
     else {key_shift = 0; evt.stopPropagation();}
  }
print1();
return;
}
function keyrelease(evt){
   evt.preventDefault();
   if(evt.keyCode == 16){
      if(key_shift == 0 ){key_shift = 1; evt.stopPropagation();}
      else {key_shift = 0; evt.stopPropagation();}
   }
print2();
return;
}

function init(){
document.body.setAttribute("contentEditable", true);
document.body.addEventListener("keydown", keyset, false);
document.body.addEventListener("keyup", keyrelease, false);
}
</script>
</head>
<body onload="init()">
<br>
<body>
</html>

步骤：1。按shift键（发生keydown和keyup事件）。 2.警报带有换档状态（print1功能运行）。我点击它。预期：警报应该带有班次状态（应该运行print2功能）。实际：print2函数无法运行。

如果我第二次按下shift键，则print2功能运行。我不明白mozilla如何处理addEventListener函数。有人可以帮我解决这个问题吗？我不想使用任何第三方框架来解决此问题（jquery，dojo等）。

由于

Answer 1

您的代码实际上很好，但警报消息从浏览器获取焦点，阻止它检测到keyup。

例如，如果更改函数以写入div，您将看到两个函数都有效：

http://jsfiddle.net/jtbowden/VqNvG/

虽然，我不明白这段代码：

if(key_shift == 0 ){key_shift = 1; evt.stopPropagation();}
 else {key_shift = 0; evt.stopPropagation();}

如果您在keyset，那么key_shift似乎应该始终为1，而不是切换：

function keyset(evt){
  evt.preventDefault();
  if(evt.keyCode == 16){
     key_shift = 1;
     evt.stopPropagation();
  }
  print1();
  return;
}
function keyrelease(evt){
   evt.preventDefault();
   if(evt.keyCode == 16){
      key_shift = 0;
      evt.stopPropagation();
   }
   print2();
   return;
}

addEventListener和attachEvent如何工作？ Keydown和Keyup无法正常工作

1 个答案: