Javascript 元素事件侦听器上的this.id将成为所有id'；单击的元素数

我在所有文本框上都有一个事件侦听器。单击文本框时，我想打开一个键盘。在键盘输入时，我想使用调用它的文本框的id来执行一些逻辑。但是id（代码中的txtbxId）只是我单击的第一个文本框，然后是我在数组中单击的第二个文本框。 例如，警报变为“textbox1”-第二次单击文本框后，警报变为“textbox1”“textbox2” 我已尝试强制变量id为“”，删除它等，但没有效果， 此处的代码片段：

$('.textbox').click(function() {            
  var txtbxId = this.id;
  $("#Keyboard").show();

  $(document).on('keydown', function(e) {
    if (e.which === 13) { 
      alert(txtbxId);                 
    }
  });
});
}); 

---

问题在于，您第一次单击文本框时的

on（'keydown'）

函数从未取消分配，因此每次单击.textbox时，您都会进行一次新的keydown回调，但不会删除旧的keydown回调

我建议在管理.keydown回调的onClick回调之外创建一个对象，以便在任何时候都只有一个对象

大概是这样的：

window.keydownmanager = {
  init: () => {
        $(document).on('keydown', function (e) {
                        window.keydownmanager.callback(e);
        });
  },

  callback: () => {},

  setCallback: (cb) => {
    window.keydownmanager.callback = cb;
  }
}

在onClick回调中，执行以下操作：

var txtbxId = this.id;

$("#Keyboard").show();
window.keydownmanager.setCallback(function(e) {
  if (e.which === 13) { 
    alert(txtbxId);                 
  }
})

---

问题在于您正在嵌套事件。因此，除了在单击事件发生时复制

keydown

事件外，您还向这些事件提供每个

id

要解决此问题，请对所有

.textbox

元素使用单个事件处理程序，并从对引发事件的元素的引用中读取它们自己的

id

，该引用可通过

this

关键字获得：

$（'.textbox'）。单击（函数（）{
$（“#键盘”）.show（）；
});
$（文档）.on（'keydown'，'.textbox'，函数（e）{
如果（e.which==13）{
警报（this.id）；
}
});