javascript - XUL 文本框 addEventListener

Question

我试图检测用户何时在 xul 文本框(firefox 扩展)中按下 escape 或 Enter。但下面的代码似乎不起作用。任何帮助将不胜感激。

const KEY_ENTER = 13;
const KEY_ESCAPE = 27;

function keyPressed(e) {
   switch (e.keyCode) {
       case KEY_ENTER:
           // do something
           break;
       case KEY_ESCAPE:
           // do something
           break;
   }
}

var textbox = document.getElementById("mytextbox");
textbox.addEventListener('keypress', keyPressed, true);

Answer 1

您是否在文本框插入文档之前运行此脚本？这个例子对我来说效果很好:

<window xmlns="http://www.mozilla.org/keymaster/gatekeeper/there.is.only.xul">
<script type="application/javascript"><![CDATA[
window.addEventListener("load", function() {
  const KEY_ENTER = 13;
  const KEY_ESCAPE = 27;

  function keyPressed(e) {
     switch (e.keyCode) {
         case KEY_ENTER:
             alert('enter');
             break;
         case KEY_ESCAPE:
             alert('escape');
             break;
         default:
             alert('default');
             break;
     }
  }

  var textbox = document.getElementById("mytextbox");
  textbox.addEventListener('keypress', keyPressed, true);
  alert('there');
}, false);
]]></script>
<textbox id="mytextbox" value="stuff"></textbox>
</window>

我也有点好奇为什么在添加监听器时要传递 true 作为捕获参数。通常，您希望在处理事件时在冒泡阶段执行操作，而不是在捕获阶段(即在调用您正在监听的元素的更具体后代上的监听器之后)。