jquery - 在处理 focusout 和 keydown 时，如何防止 Enter 键触发 focusout？

Question

我正在处理两个事件，都是 focusout和keydown ，在 $(elementID).on()事件处理程序。

调用$(elementID).off("focusout keydown");作为 .on() 中的最后一行事件处理程序似乎部分工作  --  focusout工作正常，但是 keydown正在发射两次。

---

编辑:  使用 @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 警报打开，然后触发 focusout 因为输入默认功能，然后触发 focusout 警报。所以你要做的是取消绑定(bind)焦点退出如果按下回车

    $("#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