每次用户在我的页面上的输入字段中更改数字时，如何使用 JQuery 进行拦截？ [复制]答案

【问题标题】：How can I use JQuery to intercept each time that the user change a digit inside an input field on my page? [duplicate]每次用户在我的页面上的输入字段中更改数字时，如何使用 JQuery 进行拦截？ [复制]
【发布时间】：2015-12-17 10:23:33
【问题描述】：

我是 JavaScript 和 JQuery 的新手，我有以下情况，这里是 JSFiddle：https://jsfiddle.net/AndreaNobili/eemrb8xo/3/

所以，如您所见，在 HTML 中我有这个输入字段：

<input id="variazioneAnticipo" class="rightAlligned form-control" style="width: 60%" type="number" step="0.01" min="0" value="3" />

然后我有这个 JQuery 代码：

$(document).ready(function() {
    $("#variazioneAnticipo").change(function() {
        var variazioneAnticipo = $("#variazioneAnticipo").val();
        alert("CHANGED VALUE, NEW VALUE: " + variazioneAnticipo);

    });
});

因此，正如您在前面的 JSFiddle 中看到的，当用户更改输入字段中的值时，change() 函数中声明的匿名回调函数并执行警报。

好的，这行得通。

因此用户可以通过两种方式更改值：

使用向上和向下箭头：当我单击箭头时，会正确显示警报弹出窗口。
更改在输入标签中插入新数字的值（写入）。

在第二种情况下，匿名回调函数似乎仅在用户完成插入新号码并单击输入字段时才被调用。我认为这是 JQuery change() 函数的标准行为。

我需要每次用户在输入字段中插入一个新数字时调用此函数，而不仅仅是当它插入整个数字并单击输入字段时。

我可以获得这种行为吗？我能做什么？

【问题讨论】：

试试onkeyup事件...
@RayonDabre 不，这是一个纯 JavaScript 事件，这不是 JQuery 事件，因此它不适用于 JQuery 对象
在 jQuery 中，您可以使用$(elem).on('keyup') 或$(elem).keyup()。一个简单的谷歌搜索就可以解决这个问题，但你更关注什么是适用的，什么是不适用的:(
另请参阅：stackoverflow.com/questions/3940258/…

标签： javascript jquery html jquery-events

【解决方案1】：

$(document).ready(function() {
    $("#variazioneAnticipo").bind('change keyup', function() {
        var variazioneAnticipo = $("#variazioneAnticipo").val();
        alert("CHANGED VALUE, NEW VALUE: " + variazioneAnticipo);

    });
});

【讨论】：

【解决方案2】：

使用Jquery key up 事件，你会得到你需要的结果。

$(document).ready(function() {

$("#variazioneAnticipo").keyup(function() {

    var variazioneAnticipo = $("#variazioneAnticipo").val();
    alert("ANTICIPO VARIATO: " + variazioneAnticipo);

});

});

【讨论】：

当我在输入中手动插入一个新值时，这种方式可以正常工作，但当我使用箭头修改它时却不行。我认为 bind() 更好
好的，但我认为两者的工作方式相同。使用更适合您要求的没有问题..:-)

【解决方案3】：

keyup 事件会产生很多噪音。我建议使用input 和propertychange 事件。

【讨论】：