May 25, 2000 - Modifying the Button's Banner | WebReference

May 25, 2000 - Modifying the Button's Banner

Yehuda Shiran May 25, 2000
Modifying the Button's Banner
Tips: May 2000

Yehuda Shiran, Ph.D.
Doc JavaScript

Suppose we have a button with a text inside it. We usually want our user interface to be user friendly, and change the button face according to what expected next from the user. The simplest way to do it in Internet Explorer 5.0 and up is by modifying the innerText property of the button object. We change it in the event handler function:

<HTML>
<HEAD>
<SCRIPT LANGUAGE="JavaScript">
<!--
function changeFace() {
  if (oButton.innerText == "Option is Off") {
    oButton.innerText = "Option is On"
  }
  else {
    oButton.innerText = "Option is Off";
  }
}
// -->
</SCRIPT>
</HEAD>
<BODY>
<BUTTON ID="oButton" onclick="changeFace()">Option is On</BUTTON>
</BODY>
</HTML>

And here is a demonstration: