在处理focusout和keydown时,如何防止enter键触发焦点？

Question

我处理两个事件,都focusout和keydown,在$(elementID).on()事件处理程序. 作为事件处理程序中的最后一行

调用似乎是部分工作 -  正常工作,但是发射两次. $(elementID).off("focusout keydown");.on()focusoutkeydown

---

编辑:随着@Barmar的调查结果,keydown首先触发focusout和再 keydown.这种情况在Firefox 22中发生,但显然不在Chrome 29中.

---

这是HTML:

<input type = "text" id = "textField" />
<input type = "button" onclick = "setFocus();" value = "click here" />

<ol>
      <li>Type some text into the textfield.</li>
      <li>Click the button.</li>
      <li>
            Click out of the textfield, or
            <br />
            <i>press enter for some weird behavior.</i>
      </li>
</ol>

...这里是javascript/jQuery:

 function setFocus() {
       $("#textField").focus();
       $("#textField").select();

       var count = 1;
       $("#textField").on("focusout keydown", function(e) {

              // if clicked away, or the enter key is pressed:
              if (e.type == "focusout" || e.keyCode == 13) {
                     alert(e.type + ": " + count++);
              }

              // this doesn't seem to be working correctly:
              $("#textField").off("focusout keydown");
       });
 }

......这里是jsFiddle.

Answer 1

从我可以推断出,当你按Enter键时,keydown事件被触发警报打开keydown,然后触发焦点输入默认功能,然后警告焦点输出.所以,你必须做的是解除绑定的事件的内容按下ENTER键

    $("#textField").on("focusout keydown", function (e) {
        if (e.type == "focusout" || e.keyCode == 13) {
           if(e.keyCode == 13){
             $(this).unbind('focusout');
           }
        alert(e.type + ": " + count++);
        }
    $("#textField").off("focusout keydown");
    });

这是编辑过的JsFiddle