单击 Chrome 和 Edge 中的箭头时,输入[type=number] 不断增加

Ant*_*met 5 html javascript google-chrome microsoft-edge

我遇到以下问题:加载特定 jQuery 库后,如果单击数字输入箭头,输入值会不断增加(或减少),直到焦点移到输入元素之外。

将事件绑定input到元素显示它不断触发,这让我相信某些代码一直element.value在循环中设置。但那并没有发生。

我已将问题归结为调用event.preventDefault()一个mouseup活动。

看:

document.body.addEventListener('mouseup', (e) => {
    e.preventDefault();
});
Run Code Online (Sandbox Code Playgroud)
<input type="number">
Run Code Online (Sandbox Code Playgroud)

为什么会出现这种情况?

Ant*_*met 3

我很难通过搜索导致这些无限增加的输入的原因来查找信息。

只有在自己找到原因之后,我才发现了一个类似的错误,该错误是在阻止默认值时发生的mousemove/sf/answers/2626523511/)。虽然,这样的事情似乎不会再发生了。

看起来这是一个 Chrome(和 Edge)错误。但作为/sf/answers/4567771351/所说,这实际上是默认行为,这在他所说的方式中是有意义的。我本人未能在任何地方找到这种标准行为的记录。解决该问题的一种方法是停止将事件冒泡到文档,

document.querySelector('input').addEventListener('mouseup', (e) => {
    e.stopPropagation();
});
Run Code Online (Sandbox Code Playgroud)

另一个是,没有阻止默认行为。