javascript - IE8点击事件问题

Question

我有一个 JQuery (1.8) 数据表 (1.10)，其中包含一些可就地编辑的字段，即单击它们会创建一个输入元素，可以在其中键入新数据以更新表。

在 IE8 中(但不是在 Chrome 或 Firefox 中，我没有更高版本的 IE)，在可编辑字段中按 return 似乎也会对外部按钮生成“点击”事件 table 。这很不幸，因为此按钮会打开一个 Bootstrap 模式对话框。

为什么会发生这种情况，最好的解决方法是什么？ AFAICT 输入字段没有点击处理程序(有一个 keyup 处理程序返回 false 以停止传播)。目前我假设这是某种涉及 IE8 如何以不同方式处理事件的问题，但我不确定它是如何在此按钮上生成点击事件的。

输入事件监听器是:

_setupEventListeners: function (tableEditor) {
  // Listen for key presses to trigger any finalisation actions
  this.element.on('keyup', function (event) {
  switch (event.keyCode) {
    // return or enter keys
    case  KEYCODE_ENTER:
      tableEditor.saveAndClose();
      break;
     // esc key
     case  KEYCODE_ESCAPE:
       tableEditor.revertAndClose();
       break;
     }
     // may be overkill as JQ does stopPropagation if false returned??
     event.stopPropagation();
     (event.preventDefault) ? event.preventDefault() : event.returnValue = false;
     return false;
     });
  },

按钮事件处理程序是:

$(tableId + '-addRow').click(function (event) {
    console.log("AddRow click");
    // modal opened here....
});

Answer 1

参见 http://tjvantoll.com/2013/05/22/why-are-enter-keypresses-clicking-my-buttons-in-ie/

特别是

Internet Explorer has an annoying quirk that still exists as of IE10: submit buttons can be clicked when Enter is pressed in a textbox, even when no is present.[...] No other browsers exhibit this behavior.

短期修复:让您的按钮 type='button' 而不是 type='submit'