Question

请注意，+按钮会更改输入值，并且输入不会按预期触发change, input个事件。但输入本身会在更改后触发事件

这是预期的行为还是我做错了什么？另外我想说明一点，我想看看纯粹的JavaScript解决方案

下面的示例演示

var input = document.querySelector('#number')
input.onchange = function(event){
  alert('change');
}
input.oninput = function(event){
  alert('change');
}

<button onclick="number.value++">+</button>
<input type="number" id="number" value="0" />

Answer 1

你可以从这样的javascript发送change事件：

<button onclick="number.value++;number.dispatchEvent(new Event('change'))">+</button>

演示

＆＃13;

var input = document.querySelector('#number')
input.onchange = function(event){
  alert('change');
}
input.oninput = function(event){
  alert('change');
}

＆＃13;

<button onclick="number.value++;number.dispatchEvent(new Event('change'))">+</button>
<input type="number" id="number" value="0" />

＆＃13;

Answer 2

对于输入onchange在焦点丢失时发生，而实际上在内容发生更改时发生，但oninput在更改后立即触发。当通过其他控件更改内容时，oninput不会触发。

因此，按下按钮时不会触发任何事件，因为内容通过其他控件更改而没有输入且没有触发模糊。

点击此链接：http://www.w3schools.com/tags/ev_oninput.asp

定义和用法oninput属性在元素获取时触发   用户输入。

oninput属性在＆lt; input＆gt;的值时触发。或＆lt; textarea＆gt;   元素改变了。

提示：此事件类似于onchange事件。不同的是   oninput事件紧接在a的值之后发生   元素已更改，而onchange在元素丢失时发生   焦点。另一个区别是onchange事件也可以使用   ＆LT;密钥生成＆GT;和＆lt; select＆gt;元件。

从内联javascript触发时，onChange事件不会触发

2 个答案: