Sets or retrieves the event name from the event object.
Remarks
The onpropertychange event fires when properties of an object, expando, or style sub-object change. To retrieve the name of the changed property, use the event object's propertyName property. This property returns a read-only string of the name of the property that has changed. In the case of Cascading Style Sheets (CSS) properties, the property name is prefixed with style. For example, if the CSS property pixelLeft is altered, the value of window.event.propertyName is style.left. By contrast, if the non-CSS property name is altered, the value of window.event.propertyName is name.
When the onpropertychange event fires, the srcElement property of the event object is set to the object whose property has changed.
Note Changing the innerText or innerHTML of child elements will not cause the onpropertychange event to fire for the parent element.
Example
This example demonstrates how to use the onpropertychange event to determine the name and value of an updated property.
<HTML>
<HEAD>
<SCRIPT>
function changeProp()
{
oProp.value = sText.value;
}
function changeCSSProp()
{
if(oSelect.selectedIndex==0) oStyleProp.style.color= "white";
else oStyleProp.style.color = "black";
oStyleProp.style.backgroundColor = oSelect.value;
}
function Results(){
sSrc.innerText = event.srcElement.id;
sProperty.innerText = event.propertyName;
}
</SCRIPT>
</HEAD>
<BODY>
<DIV style="background:#eeeeee; padding:10px;">Click the button below to change
its 'Value' property to the string specified in the text box.<BR><BR>
<INPUT type="text" style="width:250px" id="sText" value="Enter Some Text">
</INPUT>
<INPUT type=button id="oProp" onclick="changeProp()"
value="Change property" onpropertychange="Results();"></P>
<P>Click the button below to change its 'backgroundColor' Cascading Style
Sheet (CSS) property to the color specified in the drop-down list box.<BR>
<SELECT name="oSelect" style="width:150px">
<OPTION value="black" style="color:black">Black</OPTION>
<OPTION value="blue" style="color:blue">Blue</OPTION>
<OPTION value="green" style="color:green">Green</OPTION>
<OPTION value="red" style="color:red">Red</OPTION>
</SELECT>
<INPUT type=button id="oStyleProp" onclick="changeCSSProp()"
value="Change property" onpropertychange="Results();">
<BR><BR>
<DIV style="border:1px solid #cccccc; width:100%; padding:10px;
background:white;">
<b>Source object:</b> <SPAN id="sSrc" style="color:red;"></SPAN><BR>
<b>Property Name:</b> <SPAN id="sProperty" style="color:red;"></SPAN>
</DIV></DIV>
<BR><BR>
</BODY>
</HTML>
This feature requires Microsoft® Internet Explorer 5 or later. Click the following icon to install the latest version. Then reload this page to view the sample.
Standards Information
There is no public standard that applies to this event.
