Question

我一直试图找到一种方法，当我使用侧面的小箭头改变输入类型的数字时，我可以激活我的JS代码。但是，我发现没有办法这样做。我在表单旁边添加了两个按钮来增加和减少值。但是，达到大数字是没有效率的。到目前为止我的代码：

ajax

HTML Code Snippet：

function addValue() {
        var value = parseInt(document.getElementById('number').value, 10);
        value = isNaN(value) ? 0 : value;
        value++;
        document.getElementById('number').value = value;
        var calc = 100;
        var update = value * calc;
        var span = document.getElementById('upd');
        while( span.firstChild ) {
            span.removeChild( span.firstChild );
        }
        span.appendChild( document.createTextNode('$'+update) );
        changeFee(update);
    }
    function decreaseValue() {
        var value = parseInt(document.getElementById('number').value, 10);
        value = isNaN(value) ? 0 : value;
        var value = value - 1;
        if (value <= -1) {
            var value = 0;
        }
        document.getElementById('number').value = value;
        var calc = 100;
        var update = value * calc;
        var span = document.getElementById('upd');
        while( span.firstChild ) {
            span.removeChild( span.firstChild );
        }
        span.appendChild( document.createTextNode('$'+update) );
        changeFee(update);
    }
    function changeFee(value) {
        var fee = 0.05;
        var update = value * fee;
        var span = document.getElementById('fee');
        while( span.firstChild ) {
            span.removeChild( span.firstChild );
        }
        span.appendChild( document.createTextNode('$'+update) );   
    }

提前致谢！

Answer 1

由于某种原因，似乎输入类型编号与onChange和onInput事件不兼容。但我们可以手动将这些事件附加到输入。

{{1}}

我创建了一个简单的示例，其中输入本机控件正在运行。而且我还创建了增加/减少输入的按钮。

http://codepen.io/d2bit/pen/pNqBWj?editors=1010

希望它对你有所帮助。

JavaScript - 激活输入更改

1 个答案: