<body>
    <button id="aButton">A button</button>

    <script>
        document.querySelector("#aButton").addEventListener("click", () => {
            console.log("Button clicked!");
        })
    </script>
</body>

我有一个简单的按钮,可以记录"按钮已点击!"当它被点击 timeshift 到控制台.如果我单击该按钮,然后按Enter键,则再次单击该按钮并显示"Button Click!"第二次将消息记录到控制台.我怎么才能阻止它呢?我不希望通过Enter键点击按钮,因为我将使用Enter键用于其他目的.

推荐答案

点击按钮后,按钮将自动对焦.按下Enter Key后会再次触发.您应该添加evt.currentTarget.blur();以防止此行为.

document.querySelector('#aButton').addEventListener('click', (evt) => {
  console.log('Button clicked!');
  evt.currentTarget.blur();
});

Javascript相关问答推荐

如何通过onClick为一组按钮分配功能;

Klaro与Angular的集成

Google Apps脚本中的discord邀请API响应的日期解析问题

按下同意按钮与 puppeteer 师

JS—删除对象数组中对象的子对象

React.Development.js和未捕获的ReferenceError:未定义useState

Web Crypto API解密失败,RSA-OAEP

环境值在.js文件/Next.js中不起作用

当用户点击保存按钮时,如何实现任务的更改?

同一类的所有div';S的模式窗口

try 将Redux工具包与MUI ToggleButtonGroup组件一起使用时出错

在D3条形图中对具有相同X值的多条记录进行分组

有角粘桌盒阴影

如何在Firebase中读取对象的特定字段?

React数组查找不读取变量

如何在加载页面时使锚定标记成为焦点

使用jQuery每隔几秒钟突出显示列表中的不同单词

检测带有委托的元素内部的点击,以及元素何时按其类名被选中

如何在底部重叠多个div?

响应,Use Callback更新状态变量,该变量也存在于其依赖数组中,它如何防止无限重新呈现?