如何监测js控制input值改变的事件

Question

遇到一个问题，代码如下：

oninput和onpropertychange在改变input的value时确实起作用了，但是在js控制加减按钮改变input的value的时候，没法监测到input的value值发生改变。

请问：有什么办法能监测到js改变value值吗？

Answer 1

换了个思路，功能已实现，代码如下：<script>&nbsp; &nbsp; var localNum = localStorage.getItem('#buyNum');&nbsp; &nbsp; window.onload = function () {&nbsp; &nbsp; &nbsp; &nbsp; if(localNum == null || localNum == '' || localNum == 'null' || localNum.length == 0 || localNum == undefined || localNum == 'undefined'){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var num = new Num(1)&nbsp; &nbsp; &nbsp; &nbsp; }else{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var num = new Num(localNum)&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; num.initFn()&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; var Num = function (init) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; this.init = init&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; // 初始化&nbsp; &nbsp; &nbsp; &nbsp; Num.prototype.initFn = function () {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var _this = this&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; this.showNum(this.init)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; document.querySelector('#spSub').addEventListener('click', function() {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; _this.prevClick()&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; })&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; document.querySelector('#spAdd').addEventListener('click', function() {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; _this.nextClick()&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; })&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; document.querySelector('#buyNum').addEventListener('input', function(e) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; _this.inputBind(e)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; })&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; // 显示数字&nbsp; &nbsp; &nbsp; &nbsp; Num.prototype.showNum = function (val) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; document.querySelector('#buyNum').value = val&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; // - 按钮&nbsp; &nbsp; &nbsp; &nbsp; Num.prototype.prevClick = function () {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (this.init > 0) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; this.init--&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(this.init != localStorage.getItem('#buyNum')){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; localStorage.setItem('#buyNum', this.init);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; };&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; this.showNum(this.init)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; // + 按钮&nbsp; &nbsp; &nbsp; &nbsp; Num.prototype.nextClick = function () {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; this.init++&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if(this.init != localStorage.getItem('#buyNum')){&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; localStorage.setItem('#buyNum', this.init);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; };&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; this.showNum(this.init)&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp;&nbsp;&nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; // input 值绑定&nbsp; &nbsp; &nbsp; &nbsp; Num.prototype.inputBind = function (e) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var num = e.target.value&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var input = document.querySelector('#buyNum')&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (num === '' || num === null) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; input.value = this.init&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return false&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }else{&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; input.value = input.value&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; localStorage.setItem('#buyNum', input.value);&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; var reg = /^[0-9]*$/&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; if (!reg.test(num)) {&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; input.value = this.init&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; return false&nbsp; &nbsp; &nbsp; &nbsp; &nbsp; &nbsp; }&nbsp; &nbsp; &nbsp; &nbsp; }</script>有兴趣的可以跑代码试试，不要说什么插件之类的，自己引入jq和bootstrap，加上问题中的style和body代码，代码有些繁琐，因为要做本地存储。