Adding JavaScript - HTML5 - page 189

FiGure 21-6

Try iT

In this Try It you learn how to add an event handler and JavaScript function.

Lesson requirements

You will need the tpa_mars.html file from the Lesson_21 folder, as well as a text editor and web
browser.

You can download the code and resources for this lesson from the topic's web
page at www.wrox.com .

step-by-step
1.

Open your text editor.

2. From the Lesson_21 folder, open tpa_mars.html .

3.

Put your cursor after the closing </style> tag and press Enter (Return).

4. Enter the following code:

<script type=”text/javascript”>
<!--
function getMarsWeight() {
var theEarthWeight;
theEarthWeight = document.theForm.earthWeight.value;
if (theEarthWeight == 0) {
alert(“Please enter your Earth weight in pounds”);
document.theForm.earthWeight.focus();
}
var theMarsWeight = theEarthWeight * .38;
document.theForm.marsWeight.value = theMarsWeight + “ lbs”;
}
//-->
</script>

5.

Place your cursor in the opening <button> tag at the end and press Space.

6. Enter the following code:

onclick=”getMarsWeight();”