javascript - Google Chrome 中的按键事件检测失败

Question

我正在跟踪 Primefaces/JSF 中 p:intputText 的键盘事件，该事件更新了另一个组件。我的代码是:

    <p:remoteCommand name="test" actionListener="#{cpeTrainingEntryMB.setTrainingDetails}" 
    update=":mainForm:trainingCert :mainForm:selectDays :mainForm:trainingSchedule :mainForm:presentDays :mainForm:creditHr :messageGrowl" />
   <p:inputText id="trainingNo" value="#{cpeTrainingEntryMB.cpeMemEntry.trainingNo.trainingNo}" 
   onkeypress="if (event.keyCode == 9) { test(),traingFocus(); return false; }" >
    </p:inputText>

我跟踪了“event.keyCode == 9”，并且在 Firefox 中运行良好，但此键事件在 Google Chrome 和 IE 中不起作用。

我尝试过 Google 但找不到合适的解决方案。

Answer 1

有两个问题:

1. onkeypress 检查 Tab 不跨浏览器兼容。请改用 onkeydown。
2. 逗号是无效的行语句分隔符。您需要分号。

所以，总而言之，应该这样做:

<p:inputText ... onkeydown="if (event.keyCode == 9) { test(); trainingFocus(); }" />

<小时/>

也就是说，幸运的是 9 的 Tab 键代码值在所有浏览器中都是相同的，但通常您希望使用 jQuery 的 .on()反而。它将为您提供跨浏览器兼容的事件返回。 PrimeFaces 是一个基于 jQuery 的 JSF 组件库，已经带有 jQ​​uery 开箱即用。您应该能够直接使用它，无需任何额外的脚本。

例如

<p:inputText ... styleClass="trainingFocuser" />

有了这个(在真正的 JS 文件中!)

$(document).on("keydown", ".trainingFocuser", function(event) {
    if (event.keyCode == 9) {
        test();
        trainingFocus();
    }
});

另请参阅:

• JavaScript Event KeyCode Test Page
• QuirksMode.org - keydown, keypress, keyup