Question

我有以下问题：

我有一个HTML文本框（<input type="text">），其内容由我无法触摸的脚本修改（这是我的页面，但我使用的是外部组件）。

我希望每次文本框的值发生变化时都会在我的脚本中收到通知，所以我可以对它做出反应。

我试过这个：

txtStartDate.observe('change', function() { alert('change' +  txtStartDate.value) });

（可预见）不起作用。它只会在我自己用键盘更改文本框值然后将焦点移动到其他地方时执行，但如果脚本更改了值，则不执行它。

我还能听到另一个我不知道的事件吗？

我正在使用Prototype库，如果它是相关的，修改文本框值的外部组件是Basic Date Picker（www.basicdatepicker.com）

Answer 1

正如您暗示的那样，更改（和其他事件）仅在用户执行某些操作时触发。修改内容的脚本不会触发任何事件。你唯一的解决方案就是在控件中找到一些钩子，你可以连接到你的听众。

我将如何做到这一点：

basicDatePicker.selectDate = basicDatePicker.selectDate.wrap(function(orig,year,month,day,hide) {
  myListener(year,month,day);
  return orig(year,month,day,hide);
});

这是基于Firebug的粗略外观（我不熟悉该组件）。如果还有其他方法可以选择日期，那么你也需要包装这些方法。

Answer 2

addEventListener（“DOMControlValueChanged”将在控件的值发生更改时触发，即使它是由脚本进行的。

addEventListener（“input”是直接用户启动的DOMControlValueChanged过滤版本。

不幸的是，DOMControlValueChanged目前仅受Opera支持，并且webkit中的输入事件支持已被破坏。输入事件在Firefox和Opera中也有各种错误。

很快就会在HTML5中清除这些内容，fwiw。

更新

截至2012年9月8日，DOM中已删除DOMControlValueChanged支持（因为它已从HTML5中删除），并且“输入”事件支持在浏览器中更好（包括更少的错误）。

Answer 3

IE有一个onpropertychange事件，可用于此目的。

对于真实的网络浏览器（;）），有一个DOMAttrModified mutation event，但在Firefox中进行了几分钟的实验，我无法在文本输入时触发它以编程方式（或通过常规键盘输入）进行更改，但如果我以编程方式更改输入的名称，则会触发。 Curiouser和curiouser ......

如果你无法可靠地工作，你总是可以定期轮询输入值：

var value = someInput.value;

setInterval(function()
{
    if (someInput.value != value)
    {
        alert("Changed from " + value + " to " + someInput.value);
        value = someInput.value;
    }
}, 250);

Answer 4

根据外部javascript的编写方式，您可以随时在脚本中重写外部脚本的相关部分，并使其覆盖外部定义，以便触发更改事件。

我之前必须使用不受我控制的脚本。

您只需找到外部函数，将其作为具有相同名称的新函数完整复制，然后重新编写脚本以执行您想要的操作。

当然如果使用闭包正确编写脚本，您将无法轻易更改...

Answer 5

除了解决诺亚解释的问题之外，您还可以创建一个每隔几百毫秒检查一次值的计时器。

Answer 6

我必须以Dan建议的方式修改YUI可数据分页器控件一次。这是蛮力，但它解决了我的问题。也就是说，找到写入字段的方法，复制其代码并添加触发更改事件的语句，并在代码中处理该更改事件。您只需要使用新版本覆盖原始函数。轮询，虽然工作正常在我看来是一个更耗资源的解决方案。

Javascript事件：获取<input />控件值更改的通知

6 个答案: