时间戳

首页 > 解决方案 > 如果用户输入输入，则停止函数运行

javascript - 如果用户输入输入，则停止函数运行

问题描述

嗨，我知道这可能是一个愚蠢的问题，但我今天才开始学习 javascript，但我想知道是否有人可以帮助我或指出正确的方向我想知道如何阻止一个函数在 keydown 时触发用户正在输入

javascript

window.addEventListener("onkeydown", keyDown, true);
window.addEventListener("keydown", keyDown);

function keyDown(e) {
  switch (e.keyCode) {
    case 86: // Key V = myFunction
      myFunction();
      break;
    }
}

    function myFunction() {
      // do something
      console.log("oh no the function fired why typing in the input!")
    }

输入

<input type="text" name="message" class="chat-input" placeholder="Enter your chat message..." maxlength="140">

标签： javascript

解决方案

我认为这不是关于退出函数......如果焦点位于输入表单元素上，用户似乎询问避免运行与窗口 onkey 事件关联的事件。

为此，您不能将 window.addEventListener("onkeydown", keyDown, true) 声明为 true，因为这会将 keyDown 函数与捕获事件处理序列相关联。您需要与冒泡相关联，因此在最后一个参数中使用 false 。

window.addEventListener("keydown", keyDown, false);

然后在输入中关联一个虚拟事件处理程序并停止事件的传播，如下所示：

var inputObj = document.querySelector(".chat-input");
inputObj.addEventListener("keydown", function(e) {
    e.stopPropagation();
}, false);

通过这样做，如果浏览器焦点在输入元素上，inputObj 事件处理程序将在窗口处理程序之前触发，并且通过停止传播，事件将不会传播到窗口处理程序，因此 keyDown 函数将不会接收事件。

其他方法是检查 e.target 属性，该属性包含触发事件时聚焦的元素，并在需要时丢弃该事件。

例如检查什么是事件冒泡和捕获？了解更多信息。

推荐阅读