Using addBehavior() and removeBehavior()



/*
JavaScript Bible, Fourth Edition
by Danny Goodman 

John Wiley & Sons CopyRight 2001
*/

<HTML>
<HEAD>
<TITLE>addBehavior() and removeBehavior() Methods</TITLE>
<SCRIPT LANGUAGE="JavaScript">
var myPBehaviorID
function turnOn() {
    myPBehaviorID = document.all.myP.addBehavior("makeHot.htc")
    setInitialColor()
}
function setInitialColor() {
    if (document.all.myP.readyState == "complete") {
        var select = document.forms[0].colorChoice
        var color = select.options[select.selectedIndex].value
        document.all.myP.setHotColor(color)
    } else {
        setTimeout("setInitialColor()", 500)
    }
}
function turnOff() {
    document.all.myP.removeBehavior(myPBehaviorID)
}
function setColor(select, color) {
    if (document.all.myP.hotColor) {
        document.all.myP.setHotColor(color)
    } else {
        alert("This feature is not available. Turn on the Behavior first.")
        select.selectedIndex = 0
    }
}
function showBehaviorCount() {
    var num = document.all.myP.behaviorUrns.length
    var msg = "The myP element has " + num + " behavior(s). "
    if (num > 0) {
        msg += "Name(s): \r\n"
        for (var i = 0; i < num; i++) {
            msg += document.all.myP.behaviorUrns[i] + "\r\n"
        }
    }
    alert(msg)
}
</SCRIPT>
</HEAD>
<BODY>
<H1>addBehavior() and removeBehavior() Method Lab</H1>
<HR>
<P ID="myP">This is a sample paragraph. After turning on the behavior, 
it will turn your selected color when you mouse down anywhere in this 
paragraph.</P>
<FORM>

<INPUT TYPE="button" VALUE="Switch On Behavior" onClick="turnOn()">
Choose a 'hot' color:
<SELECT NAME="colorChoice" onChange="setColor(this, this.value)">
<OPTION VALUE="red">red
<OPTION VALUE="blue">blue
<OPTION VALUE="cyan">cyan
</SELECT><BR>
<INPUT TYPE="button" VALUE="Switch Off Behavior" onClick="turnOff()">
<P><INPUT TYPE="button" VALUE="Count the URNs" onClick="showBehaviorCount()"></P>
</BODY>
</HTML>

Related examples in the same category

1.	Using the fireEvent() Method
2.	onBlur and onFocus Event Handlers
3.	Using the onSelectStart Event Handler
4.	Calling to Display the Alert Dialog onLoad
5.	Calling to Display the Alert Dialog Directly
6.	JavaScript Event Handlers :Loading/ Unloading a Document
7.	Handling Load Events in a Content Document
8.	Using Event Bubbling with the onClick Event
9.	Running a Script from the onLoad Event Handler

Using addBehavior() and removeBehavior() : HTML Body Event « HTML « JavaScript DHTML

Related examples in the same category