javascript - Firefox中文本框的onpropertychange？

Question

如何onpropertychange使用 JavaScript 处理 Firefox 中的文本框？

下面是一个例子：

var headerBGColorTextBox = document.getElementById('<%= tbHeaderBGColor.ClientID %>');

if (headerBGColorTextBox != null) {
  headerBGColorTextBox.pluggedElement = document.getElementById('<%= trHeaderBG.ClientID %>');
  headerBGColorTextBox.onpropertychange = function() {
    alert('function called');
    if (event.propertyName == 'style.backgroundColor' && event.srcElement.pluggedElement != null)
      alert(event.propertyName);
    event.srcElement.pluggedElement.style.backgroundColor = event.srcElement.style.backgroundColor;
  };
}

Answer 1

有两种方法可以模拟 onpropertychange 事件，上面提到的 Mutation 事件应该在现代浏览器中同样有效，而“object.watch”非标准方法将为旧版本的 FF < 3 提供支持。

请参阅有关 MDC 的文档。

对象观察

突变事件

Answer 2

似乎该onpropertychange事件是 IE 特定的：http: //www.aptana.com/reference/html/api/HTML.event.onpropertychange.html。

然而，话虽如此，Firefox，至少 3.0.10 确实支持名为“DOMAttrModified”的事件。以下是其工作原理的片段：

document.body.addEventListener("DOMAttrModified", function () { console.log ("Args: %o", arguments); }, false);
document.body.id = "Testing";

假设安装console.log了 Firefox 扩展Firebug。

Answer 3

onpropertychange是非标准的。请参阅http://msdn.microsoft.com/en-us/library/ms536956

Answer 4

以下代码有效：

var foo = '<%= tbHeaderBGColor.ClientID %>';

function changetext() 
  {
  alert('function called');
  if (event.propertyName == 'style.backgroundColor' && event.srcElement.pluggedElement != null)
    alert(event.propertyName);

  event.srcElement.pluggedElement.style.backgroundColor = event.srcElement.style.backgroundColor;
  }

if (!!document.addEventListener)
  {
  document.getElementById(foo).addEventListener("DOMAttrModified", changetext, false);
  }
else
  {
  document.getElementById(foo).addBehavior("foo.htc");
  document.getElementById(foo).attachEvent("onpropertychange", changetext);
  }

DOM 突变事件