Including scripts in your HTML page - Wiley Publishing For Dummies HTML for Dummies, pdf

Linking a script to an HTML element that you plan for a user to interact with is simple. You place the script code in the <script> element in the document header. Then you attach the script name to an event attribute in an HTML element. Listing 12-1, for example, specifies that when the user clicks the submit button, the browser should verify that the user filled out both fields in the form.

Listing 12-1: Verifying the User Fills Out Both Form Fields <html>

<head>

<title>Linking scripts to HTML pages</title> <script language="javascript">

function checkSubmit ( thisForm ) {

if ( thisForm.FirstName.value == ‘’ ) {

alert(‘Please enter your First Name.’); return false;

}

if ( thisForm.LastName.value == ‘’ ) {

alert(‘Please enter your Last Name.’); return false;

HTML 4 for Dummies, 4th Edition

Whether your goal is to build a simple, text-oriented Web site or one loaded with frames, graphics, and animation, this step- by-step book will put you on the right track.

Table of Contents

HTML 4 For Dummies, 4th Edition Introduction

Part I - Meeting HTML in Its Natural Environment

Chapter 1 - The Least You Need to Know about HTML and the Web Chapter 2 - HTML at Work on the Web

Chapter 3 - Creating Your First HTML Page Part II - Getting Started with HTML

Chapter 4 - Structuring Your HTML Documents Chapter 5 - Linking to Online Resources Chapter 6 - Finding and Using Images

Chapter 7 - Top Off Your Page with Formatting Part III - Taking HTML to the Next Level

Chapter 8 - HTML Tables Chapter 9 - HTML Frames Chapter 10 - HTML Forms

Part IV - Extending HTML with Other Technologies Chapter 11 - Getting Stylish with CSS

Chapter 12 - HTML and Scripting Chapter 13 - Making Multimedia Magic

Chapter 14 - Integrating a Database into Your HTML Chapter 15 - How HTML Relates to Other Markup Languages Part V - From Web Page to Web Site

Chapter 16 - Creating an HTML Toolbox Chapter 17 - Setting Up Your Online Presence Chapter 18 - Creating a Great User Interface Part VI - The Part of Tens

Chapter 19 - Ten Ways to Exterminate Web Bugs Chapter 20 - Ten HTML Do’s and Don’ts

Part VII - Appendixes Appendix A - HTML 4 Tags

Appendix B - HTML Character Codes Appendix C - Glossary

Index

Cheat Sheet- HTML 4 For Dummies, 4th Edition List of Figures List of Tables List of Listings List of Sidebars return true; } </script> </head> <body>

<form method="POST" action="http://www.someURL.com/" onsubmit="return checkSubmit(this);">

<p>

First Name: <input type="text" name="FirstName"><br> Last Name: <input type="text" name="LastName"><br> <input type="submit">

</p> </form> </body> </html>

Notice that the value of the onsubmit attribute, return checkSubmit(this);, includes the name following function in the <script> element, checkSubmit. This tells the browser to run the

checkSubmit function in the script on this form. You may want to have several different sets of

instructions for the browser to run, depending on what a user does with the page. In that case, store each set of instructions as its own function, and link the function to the event attribute.

Tip If this script looks like Greek to you, don’t worry. The “Form validation” section later in the chapter walks you through everything going on in this script.

Technical Stuff The double parentheses following the name (in both the script and the attribute values) are part of the scripting syntax. You can pass parameters to the script within the parentheses so you can reuse a single script for several elements. When you use someone else’s script in your Web page, carefully read any instructions that come with the script. Verify whether you have to put any information in the parentheses or can leave them empty.

You can also put scripts directly into the value of an event attribute (instead of storing them in the

document header). This technique works best for short scripts like the one in the “Image rollover” section later in the chapter.