javascript - 在不进行轮询的情况下监听由 JavaScript 更改的输入值

Question

我们正在开发的网站上有很多表格。其中一些表单具有根据用户所做的其他事情使用 JavaScript 填充特定字段的功能。 (例如邮政编码查找)。

对于每个表单，当每个表单字段值被修改时，我们都希望做一些事情。

• On change 事件不会由 JavaScript 更改的值触发。

• MutationObserver 似乎无法监听值的变化 (它只监听属性变化，不监听属性变化)。除非 我错过了什么？

• 我们不想(在某些情况下不能)改变 JavaScript 填充字段以触发更改事件。

因此，我们有一个表单，其中的字段值可能由某些 JavaScript 或其他地方填充，我们需要知道字段值何时发生变化。

目前我们想出的唯一可行的解​​决方案是使用“polling” ' 定期检查所有字段(使用 setInterval)以查看它们的值是否已更改。我们想知道是否有人可以提出更好的解决方案？

(我们使用的是 jQuery 1.11.2)。

更新:我们已经找到了我发布在下面的这个问题的答案。但是，我们不知道重新定义对象的默认属性可能会产生什么后果，因此我们还没有 100% 满意该解决方案，并继续寻找更多想法。

Answer 1

GracefulLight posted here 的解决方案Rory 给我们的那个确实有用。

您可以重新定义对象的 value 属性，使您能够在设置 value 属性时执行任何您喜欢的操作。

Object.defineProperty(document.querySelector(".my-object"), "value", {
  set: function(newValue) {
    console.log("Object's value property has changed");

    // do something
    this.style.borderColor = "#228B22";

    // make sure the value is still passed to the input to be output
    return this.defaultValue = newValue;
  }
});