JavaScript EditorBest javascript editor debugger     Ajax website 
↑


Main Page

Previous Page
Next Page

Triggering a Script

Sometimes you won't want a script to run until the visitor does something to trigger it. For example, perhaps you want to run a script when the visitor mouses over a particular picture or link, or when a page is loaded. These actionsmousing over or loading a pageare called intrinsic events. There are currently 18 predefined intrinsic events. You can use them as triggers to determine when a script will run.

To trigger a script:

1.
Create the (X)HTML tag that the intrinsic event depends on (Figure 19.6).

Figure 19.6. First, create the (X)HTML tag that the intrinsic event depends on. In this case, I want the script to occur when a visitor clicks the link. Therefore, I have to start with the link tag.


2.
Within the tag created in step 1, type event, where event is an intrinsic event as defined below (Figure 19.7). Unless otherwise noted, most events can be used with most (X)HTML tags.

Figure 19.7. The event name and the script itself go right inside the (X)HTML tag. Make sure to enclose the script in double quotation marks.


onload occurs when a browser loads a page or frameset. onunload occurs when it unloads. They can be used in the body or frameset tags.

onclick occurs when the visitor clicks an element. ondblclick occurs when they double click it.

onmousedown occurs when the visitor points at an (X)HTML element and presses the mouse button down. onmouseup occurs when they let go.

onmouseover occurs when the visitor points at an element. onmousemove occurs when the visitor moves the pointer that is already over an element. onmouseout occurs when the visitor moves the pointer away from the element.

onselect occurs when the visitor selects some text in a form element.

onfocus occurs when the visitor selects or tabs to an element. onblur occurs when the visitor leaves an element that was "in focus".

onkeypress occurs when the visitor types any character in a form element. onkeydown occurs even before the visitor lets go of the key and onkeyup waits until the visitor lets go of the key. As you might imagine, these only work with form elements that you can type in.

onsubmit occurs when the visitor clicks the submit button in a form (see page 272). onreset occurs when the visitor resets the form (see page 274).

onchange occurs when the visitor has changed the form element's value and has left that element (by tabbing out or selecting another).

3.
Next, type ="script", where script is the actual script that should run when the event occurs.

Figure 19.8. A triggered script doesn't run until the visitor completes the required action. In this case, they have to click the link.


Figure 19.9. Once the visitor clicks the link, the script runs. In this case, an alert appears, giving the current date and time.


Tips

  • If your script requires quotation marks, use single quotation marks so that they're not confused with the quotation marks that enclose the entire script (in step 3).

  • If you need to use quotes within text that is already enclosed in single quotation marks, you can backslash them. So, you could use onclick="alert('Here is today\'s date:' + Date())". Without the backslash, the apostrophe in today's would mess up the script.

  • For a complete listing of which intrinsic events work with which (X)HTML tags, consult the table on page 418.

  • Also see Setting the Default Scripting Language on page 320.



Previous Page
Next Page


JavaScript EditorBest javascript editor debugger     Ajax website 
→ R7