原型/javascript - 除非焦点在文本框中，否则 firefox 不会触发 keypress/keydown 事件答案

【问题标题】：prototype/javascript - firefox not firing keypress/keydown event unless focus is in textbox原型/javascript - 除非焦点在文本框中，否则 firefox 不会触发 keypress/keydown 事件
【发布时间】：2011-12-29 20:23:27
【问题描述】：

以下在 IE6、IE7 和 chrome 上运行良好。不适用于 ff 3.0.7。

<html><head>
<script src="prototype.js" type="text/javascript" ></script>
<script type="text/javascript">
Event.observe(window, 'load', 
    function(){
        Event.observe(document.body, 'keydown', myEventHandler);
        alert('window load');
    });
function myEventHandler(evt) {
    alert(evt);
}
</script>
</head>
<body >
<input type="text" /><br><br>
</body></html>

编辑：“不工作”是指 myEventHandler 没有在 firefox 中触发。

EDIT2：此外，当焦点位于输入元素上时它可以正常工作。我希望它为所有按键触发。

【问题讨论】：

标签： javascript events prototypejs

【解决方案1】：

~~我不知道您的代码为什么不起作用，但它过于复杂~~ - 这应该可以解决问题：

document.observe('keydown', myEventHandler);

无需等待load，因为document 立即可用。

您的代码不起作用，因为并非所有关键事件都源自文档的正文元素。 Opera 的问题与 Firefox 中的问题类似，但原始元素似乎还取决于鼠标光标的位置。

无论如何，解决方法是只捕获 document 级别的事件，因为只要没有人阻止它们这样做，所有 DOM 事件最终都会冒泡到 document。

【讨论】：

谢谢，我不知道你可以那样做。我只是 $('id').observe('keypress', function(t){if(e.keyCode==13){getTypes()}});使推入在我的文本框上运行一个函数。

【解决方案2】：

我还发现我的 keydown 事件没有在 Firefox 中触发类似代码。就我而言，我不需要使用除 Safari 和 Firefox 之外的任何东西，所以我没有在 IE 上测试过。尽管如此，观察 'document' 而不是 'document.body' 似乎有效：

document.observe('dom:loaded', function() {
    Event.observe(document, 'keypress', function(evt) {
       alert("In Keypress Function");
    });
});

现在，我意识到这是观察按键，而不是按键。 AFAIK，keypress 是在 keydown 之后立即生成的。

【讨论】：

【解决方案3】：

尝试用表单元素包装输入。如果这没有帮助，请将其扭曲到 div 中并将您的处理程序附加到 div。

【讨论】：

以表格形式包装没有改变。包装在 div 中并将处理程序附加到 div 破坏了 IE 和 Chrome，而没有修复 FF。请注意，无论焦点是否在输入元素中，我都希望事件处理程序触发。

【解决方案4】：

顺便说一句，对于 tab、esc 和类似的，您需要使用 keyup，而不是 keypress。至少对于 Safari，我花了很长时间才弄明白。

通过在匿名中添加此行来亲自查看：alert ("Key :" + evt.keyCode);。功能。只有字形响应。

--戴夫

【讨论】：