onpropertychange สำหรับกล่องข้อความใน Firefox?

วิธีจัดการ onpropertychange สำหรับกล่องข้อความใน Firefox โดยใช้ JavaScript

ด้านล่างนี้เป็นตัวอย่าง:

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;
  };
}

person Tushar Maru    schedule 28.05.2009    source แหล่งที่มา


คำตอบ (4)


มีสองวิธีในการเลียนแบบเหตุการณ์ onpropertychange เหตุการณ์ Mutation ตามที่กล่าวไว้ข้างต้นที่ควรทำงานอย่างเท่าเทียมกันในเบราว์เซอร์สมัยใหม่ และวิธีการ "object.watch" ที่ไม่ได้มาตรฐานที่จะให้การสนับสนุน FF ‹ 3 เวอร์ชันเก่า

ดูเอกสารประกอบเกี่ยวกับ MDC

Object.watch

เหตุการณ์การกลายพันธุ์

person Christophe Eblé    schedule 28.05.2009
comment
OBJECT.watch จะไม่ติดตามการเปลี่ยนแปลงองค์ประกอบ DOM คุณต้องใช้เหตุการณ์การกลายพันธุ์ DOMAttrModified ในเบราว์เซอร์ที่รองรับ W3C OBJECT.watch ใช้สำหรับการเปลี่ยนแปลงคุณสมบัติการติดตามบนออบเจ็กต์ที่คุณสร้างใน Javascript เท่านั้น - person ThatGuy; 05.08.2011

ดูเหมือนว่าเหตุการณ์ 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 แล้ว

person Jordan S. Jones    schedule 28.05.2009
comment
DOMAttrModified ยังรองรับโดย IE9 และ Opera(7+) ยังใช้งานไม่ได้ใน webkit ณ เดือนสิงหาคม 2554 - person ThatGuy; 05.08.2011
comment
@nix: ยังไม่มีข่าวสำหรับ WebKit? คุณรู้ไหมว่าพวกเขาวางแผนที่จะสนับสนุนกรณีการใช้งานประเภทนี้อย่างไร - person Eldros; 12.09.2011

onpropertychange ไม่เป็นมาตรฐาน ดู http://msdn.microsoft.com/en-us/library/ms536956

person Matthew Flaschen    schedule 28.05.2009

รหัสต่อไปนี้ใช้งานได้:

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

person Paul Sweatte    schedule 05.01.2012