<input type="number" /> 当它的值改变时会触发什么事件?

IT技术 javascript html
2021-02-18 06:41:08

只是想知道是否有人知道<input type="number" />单击向上/向下箭头时HTML5元素会触发什么事件

示例数字输入

onblur当焦点离开输入字段时,我已经在使用for 。

5个回答

change 将是字段值更改时触发的事件。

我认为 HTML5 事件input也会触发。

change 输入值时不会触发,只有在单击按钮时才会触发(至少在 Firefox 上)。
2021-04-22 06:41:08
input 就像是两者之间的融合 keyup change
2021-04-23 06:41:08
onchange 和 oninput 都在 Opera 中工作,但只有 oninput 可以在 Chrome 中工作(只有当我从事件处理程序返回 false 时 - 否则 Chrome 会反复触发 oninput 事件)
2021-04-27 06:41:08
只有oninput在单击“向上”和“向下”箭头时才会触发。
2021-04-29 06:41:08
但 onchange 只在模糊上触发,至少在 Firefox 中是这样。我想我们将不得不寻找按键。
2021-05-05 06:41:08

我发现对于 jQuery,以下代码涵盖了 Chrome 中的键盘输入、鼠标滚轮更改和按钮点击,并且还处理了 Firefox 中的键盘输入

$("input[type=number]").bind('keyup input', function(){
    // handle event
});
如果您想获取输入字段内的滚动事件,还可以使用“鼠标滚轮”。
2021-04-21 06:41:08
也添加“改变”,它是完美的。您仍然希望监听外部更改,无论如何添加它也没有坏处。
2021-05-04 06:41:08
请注意,.bind()现在已弃用.on()
2021-05-13 06:41:08

我发现onkeyuponchange涵盖了 Chrome 19 中的所有内容。它处理直接值输入、向上向下箭头按键、单击按钮和滚动鼠标滚轮。

onchange单独在 Chrome 中就足够了,但其他只将字段呈现为文本框的浏览器需要onkeyup绑定,它可以完美地读取新值。

mousewheel单独绑定事件不太成功。事件触发得太早 - 在字段值更新之前 - 因此总是给出字段的先前值

对于 Firefox 也是如此。
2021-05-15 06:41:08

onchange事件在模糊时触发,但在oninput您键入时触发。也许您可能想在oninput事件上放置一个计时器onchange在用户停止输入一秒钟时触发您的事件?

当在数字输入中使用箭头键时,Edge 中有一个当前的错误会阻止更改或输入被触发。