Javascript 为什么格式化输入字段会阻止onChange事件发生

我有一些基本如下的代码

.on("keyup", "input", function (e) {
    this.value = utils.formatNumber(this.value);                    
})
.on("change", "input", function(e) {
    expensiveFunctionThatUpdatesView();
})

实际上，这些值的格式与用户类型相同，但当用户在输入字段外单击或单击时，不会触发onChange事件（因此视图不会更新）。如果我注释掉keyup事件处理程序函数的主体，则所有内容都会按预期工作（格式化除外）。为什么会这样

总之，要触发onchange事件，需要满足以下条件：

用户必须通过触发onfocus事件（存储旧值）的某种方式进入控制/输入字段

焦点上存在的值与“退出”/“模糊”上存在的值不同

---

顺便说一句，我试着将代码改为“模糊”，但如果我格式化字段，也不会触发。测试时使用Chrome。

您可以为两个事件触发相同的回调函数，以启用数字格式：

.on( 'keyup change', 'input', function ( e ) {
    this.value = utils.formatNumber( this.value );
    updateView();
})

---

您可以为两个事件触发相同的回调函数以启用数字格式：

.on( 'keyup change', 'input', function ( e ) {
    this.value = utils.formatNumber( this.value );
    updateView();
})

---

通过javascript（或通过

val（）

/

text（）

）设置文本框值永远不会触发浏览器更改事件。您需要保存原始值，将其与post格式值进行比较，并以编程方式触发更改：

.on("keyup", "input", function (e) {
    var originalValue = this.value;
    var newValue = utils.formatNumber(originalValue);

    this.value = newValue;

    if (originalValue !== newValue) {
        $(this).trigger('change');
    }
})

---

通过javascript（或通过

val（）

/

text（）

）设置文本框值永远不会触发浏览器更改事件。您需要保存原始值，将其与post格式值进行比较，并以编程方式触发更改：

.on("keyup", "input", function (e) {
    var originalValue = this.value;
    var newValue = utils.formatNumber(originalValue);

    this.value = newValue;

    if (originalValue !== newValue) {
        $(this).trigger('change');
    }
})

---

不，这会触发太多对updateView（）的调用。updateView（）是一个昂贵的函数，它会触发大量服务器端活动。将更新此信息。我感兴趣的是为什么，而不是如何：-）@oligofren我猜“为什么”是jQuery内部的。你试过在上问这个问题吗？不，那会触发太多对updateView（）的调用。updateView（）是一个昂贵的函数，它会触发大量服务器端活动。将更新此信息。我感兴趣的是为什么，而不是如何：-）@oligofren我猜“为什么”是jQuery内部的。试图在？上问这个问题，但在某种程度上，用户通过输入文本（在格式化文本之前）触发了浏览器事件。我想这种情况是由浏览器实现决定的——Firefox实际上触发了change（），而WebKit没有。但在某种程度上，用户通过输入文本（在格式化文本之前）触发了浏览器事件。我想这种情况是由浏览器实现决定的——Firefox实际上触发了change（），而WebKit没有。