按 Enter 键后使用 preventdefault 退出循环

Question

这是对我最初问题的完整修改，删除了所有不必要的资源和参考

我将同一个事件侦听器绑定到 2 个不同的元素：按钮和 Enter 键，如下所示：

var funcelement = function(){
    //function code
};


$('#buttonID').click(funcelement);


$('#inputID').keyup(function () {
   if (event.which == 13) {
      $('#buttonID').trigger('click');
   }
})

我想做的是在焦点位于提交按钮 (#buttonID) 上时使用 preventDefault() 来防止回车键传播。

所以我尝试了各种组合来让它发挥作用。以下是我尝试的最新结果

$('#inputID').keyup(function () {
   var hasfocus = $('#buttonID').is(':focus') || false;

   if (event.which == 13) {
      if (!hasfocus) {
         event.preventDefault();
         $('#buttonID').trigger('click');
         //hasfocus = true;
      }

      else {
         //event.preventDefault();
         //$('#buttonID').trigger('click');
     }

   }
})

当我在输入框中输入文本并按下 Enter 键后，弹出确认 window 和 yes/cancel 按钮，焦点在是按钮上。当我再次按下 Enter 键时，另一个 window 确认已进行更改弹出，并带有聚焦在其上的“确定”按钮。一旦我再次按下 Enter，我需要的一切都在制作中。

但是，有一个问题：完成最后一步后，我将返回 if (!hasfocus) 行。

如何防止这种情况发生？一旦我需要的东西完成 - 我不想再进入那行。

Answer 1

您可以将参数传递给函数并停止那里的传播，如下所示：

var funcelement = function(event, wasTriggeredByEnterKey){
   if (wasTriggeredByEnterKey && $('#buttonID').is(':focus')) {
       event.stopPropagation;
   }

    //function code
};


$('#buttonID').click(funcelement);



$('#inputID').keyup(function () {
    if (event.which == 13) {
        $('#buttonID').trigger('click', [true]);
    }
  }
)

更新

为了回答您修改后的问题，您在处理警报时应该使用 "keydown" 事件而不是 "keyup"。这是因为警报以 "keydown" 事件关闭，但是当您释放回车键时您仍然触发 "keyup" 事件。只需像这样更改一个单词：

$('#inputID').keydown(function () {
   var hasfocus = $('#buttonID').is(':focus') || false;

   if (event.which == 13) {
      if (!hasfocus) {
         event.preventDefault();
         $('#buttonID').trigger('click');
         //hasfocus = true;
      }

      else {
         //event.preventDefault();
         //$('#buttonID').trigger('click');
     }

   }
})

按 Enter 键后使用 preventdefault 退出循环

Use a preventdefault to get out of the loop after pressing Enter key

javascript

preventdefault