As explained in a previous page, a Behavior generates its own custom events. But to trigger any action, a Behavior needs to start its tasks from standard events at the host page. The attachEvent() method sets the connection between a standard event and a Behavior function that handles this event. The attachEvent() method provides a similar functionality to the event handler definition. It specifies the object targeted for the specified event, the event name, and the handling function:

returnCode = object.attachEvent(eventName, eventHandlingFunction)

The attachEvent() method returns a boolean value, returnCode. It is TRUE if the event was bound successfully to its handling function, and FALSE otherwise. If the object prefix is omitted, the element that the behavior applies to is used.

With duplicate handling functions between the containing page and the behavior's scriptlet, it is important to understand the order in which they are executed. An event handler in a host page has priority over the one in a scriptlet. If there is a duplicate definition of an event handler inside the scriptlet (for the same event), the order is arbitrary and cannot be predetermined. This is a good reason to have only one event handler (per event) in the scriptlet .

Let's identify the attachEvent() calls in our Connect Three game's behavior:

<SCRIPTLET ID="xmixdrix">

<IMPLEMENTS ID="kuku" TYPE="Behavior" DEFAULT>
<EVENT NAME="onBoxLoad"/>
<EVENT NAME="onBoxClick"/>
</IMPLEMENTS>

<IMPLEMENTS TYPE="Automation">
<PROPERTY NAME="x"/>
<PROPERTY NAME="y"/>
</IMPLEMENTS>

<SCRIPT LANGUAGE="JavaScript">
style.position = "absolute";
style.pixelTop = y;
style.pixelLeft = x;
src = "ibutton.bmp";
window.lastPlayedBy = "o";

window.attachEvent("onload", onload);
attachEvent("onclick", onclick);

function onclick() {
  var a = src;
  if (src.indexOf("ibutton.bmp") < 0) return;  
  clickEvent = createEventObject();
  clickEvent.id = uniqueID;
  if (window.lastPlayedBy == "o") {
    src = "xbutton.bmp";
    window.lastPlayedBy = "x";
    clickEvent.playedBy = "x";
  }
  else {  // lastPlayedBy = "x"
    src = "obutton.bmp";
    window.lastPlayedBy = "o";
    clickEvent.playedBy = "o";
  }
  fireEvent("onBoxClick", clickEvent);
}

function onload() {
  loadEvent = createEventObject();
  loadEvent.id = uniqueID;
  fireEvent("onBoxLoad",loadEvent);
}

</SCRIPT>
</SCRIPTLET>

Notice the two different objects prefixing the attachEvent() calls. The first call applies to the window object, while the second one applies, by default, to the element that the behavior is defined for. If a default behavior is not defined in the Behavior-type Implements statement, the second call to the attachEvent() method above would have been:

kuku.element.attachEvent("onclick", onclick)

Sometimes you want to disconnect a handling function from an event. You accomplish it by calling the detachEvent() method. Its parameters are identical to those of attachEvent().