通过JS更新值时，更改/输入的jQuery无法正常工作

Question

我注意到，当javascript本身完成更改时，$('#firstId')的事件没有触发。

为什么会这样？

有没有办法解决这个事件？

这是一个例子：

＆＃13;

＆＃13;

$('#firstId').on('change input paste', function(){
  console.log("this is the input event being fired");
});

$('#randomButton').on('click', function(){
  $('#firstId').val(Math.floor(Math.random()*2147483647 )+1);
  console.log("randomButton being fired");
});

＆＃13;

<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<span for="firstId">number: </span>
<input type="number" id="firstId"/>
<p>Or</p>
<button id="randomButton">Get a random number</button><br>

＆＃13;

＆＃13;

＆＃13;

Answer 1

这是因为上面通过处理程序附加的所有事件都是由用户操作触发而不是通过代码触发的。您可以在此处使用.trigger()或.change()来触发事件：

$('#firstId').val(Math.floor(Math.random()*2147483647 )+1).change();

或

$('#firstId').val(Math.floor(Math.random()*2147483647 )+1).trigger('change');