Javascript 如果我显示警报，为什么取消按键不起作用_Javascript_Jquery

Javascript 如果我显示警报，为什么取消按键不起作用

javascript jquery

Javascript 如果我显示警报，为什么取消按键不起作用,javascript,jquery,Javascript,Jquery,我想取消一个向下键，它在我不显示警报时起作用如果我显示一个，它将不工作 JS Fiddle在这里：为什么呢 <body> Without alert it works - with alert it does not <input type="text" class="noalert" value="without alert"> <input type="text" class="alert" value="with alert"> &l

我想取消一个向下键，它在我不显示警报时起作用

如果我显示一个，它将不工作

JS Fiddle在这里：

为什么呢

<body>
  Without alert it works - with alert it does not
  <input type="text" class="noalert" value="without alert">
  <input type="text" class="alert" value="with alert">
  <div class="alert" contenteditable=true>alert</div>
  <div class="noalert" contenteditable=true>noalert</div>
</body>

如何修复它？

这与捕获用户操作和引发事件的顺序有关。要执行所需操作，请使用

按键

：

$('.alert').on('keypress', function(event) {
    event.preventDefault();
    event.stopPropagation();
    window.alert('keypress intercepted');
    return false;
});

这是因为

键控的工作方式
当用户第一次按下按钮时，keydown事件被发送到元素
按键盘上的键。它可以附加到任何元素，但事件
仅发送到具有焦点的元素
当您显示警报时
，元素将失去焦点，焦点将转移到警报框。这就是为什么在您提到的两种情况下会出现不同的行为。
这似乎与我无关：此处的引号涉及事件发送到的元素，而不是事件发送后处理程序无法preventDefault
的原因。浏览器决定将事件发送到何处是在执行处理程序函数之前做出的。@apsillers，我可以理解您的担忧，但我确信preventDefault与这种情况无关。您可以尝试删除它。我会在一段时间内更新答案。这是由于键绑定事件的工作方式不一致造成的。有关更多信息，请参阅
$('.alert').on('keypress', function(event) {
    event.preventDefault();
    event.stopPropagation();
    window.alert('keypress intercepted');
    return false;
});