Question

以下是我的代码示例

<html>
<script>
function onKeyUpEstimatedHoursInput() {
  console.log("onKeyUpEstimatedHoursInput - 1");
}
function onKeyPressEstimatedHoursInput() {
  console.log("onKeyPressEstimatedHoursInput - 1");
}
function onChangeEstimatedHoursInput() {
  console.log("onChangeEstimatedHoursInput - 1");
}
</script>

<input type="number" onchange="onChangeEstimatedHoursInput();" onkeypress="onKeyPressEstimatedHoursInput();" onkeyup="onKeyUpEstimatedHoursInput();" step="0.01">
</html>

问题在于，如果您点击“增加值”＆＃39;或者＆＃39;减少价值＆＃39;按键

只有在您第一次点击它时才会触发在屏幕截图中，我点击了20次。但移动鼠标两次。第一次代码写入日志然后第一次移动鼠标后浏览器 - Chrome，Firefox（Win7）。

问题：如何获得所有点击次数？

Answer 1

事实上，在Chrome中似乎有些点击不会生成change事件。我无法在FireFox中重现它。

但还有另一个事件不需要关注离开输入区域：input。这将始终触发I / O意味着改变输入内容的任何内容：上/下按钮，鼠标拖放，键盘，上下文菜单，其他不寻常的输入设备......

function onInput() {
  console.log("onInput");
}

<input type="number" oninput="onInput();" step="0.01">

Answer 2

使用addEventListener

下面的

是如何将多个事件绑定到一个元素的示例

https://jsfiddle.net/3h89wLfa/5/

{{1}}

{{1}}

你也可以将mouseup剪切或粘贴事件绑定到它。

EventTarget.addEventListener（）方法在调用它的EventTarget上注册指定的侦听器。事件目标可以是文档中的元素，文档本身，窗口或支持事件的任何其他对象（例如XMLHttpRequest）。

如果鼠标不移动，则输入中的OnChange不会触发

2 个答案: