Books
in black and white
Main menu
Home About us Share a book
Books
Biology Business Chemistry Computers Culture Economics Fiction Games Guide History Management Mathematical Medicine Mental Fitnes Physics Psychology Scince Sport Technics
Ads

Javascript for dummies. Quick Reference - Vander

Vander Javascript for dummies. Quick Reference - Wiley Publishing, 2002. - 115 p.
Download (direct link): javascriptquickreference2002.pdf
Previous << 1 .. 45 46 47 48 49 50 < 51 > 52 53 54 55 56 57 .. 72 >> Next

onBl ur events on the sel ect, text, and textarea objects provide a great opportunity to do any field-level validation that you need to do. The user presumably has finished entering text or making a selection, so if you invoke a function to validate the field at this point, you can get back to the user immediately if a problem exists. See also “Validating User Input” in Part IX.
Syntax:
onBlur="event handling text"
Example:
You can use the onBl ur event handler with the frame, sel ect, text, texta rea, and wi ndow objects. The following sections contain examples of onBl ur for each object.
frame
The first chunk of code below defines a frame named f ramel whose source is the HTML file fra me onl.html; the second chunk of code shows how the onBl ur event handler is implemented for
framel.
<FRAMESET R0WS="50%,50r C0LS="402,60%">
<FRAME SRC="framconl.html" N AM E="framel”>
<FRAME SRC="framcon2.html" NAME="frame2"> </FRAMESET>
(The following code, which defines the frame f ramel, is from the file called framconl.html highlighted in the preceding code sample.)
<B0DY BGC0L0R="1i ghtgrey"
onBlur="document.bgColor='black'" on Foeus“"document.bgColor='whi te'">
select
<F0RM>
Product: <SELECT NAME="produ9tSelection" SIZE=1 onBlur="processSelection(thi s) ">
<0PT10N VALUE="shirt"> t-shirt
(continued)
On Change
(continued)
<OPTION VALUE="pen"> ball-point pen
<0 PTI ON VALUE="weight"> monogrammed paperweight
</SELECT>
text
Last name: <INPUT TYPE="text" VALUE=""
NAME=”1astName" SIZE=25
onBlur="veri fyExi stence(thi s.value)">
textarea
<TEXTAREA NAME=''commentField" R0WS=5 COLS=50 onBlur="if (! this.value) { confirm('Are you sure you don't want to comment?')}">
</TEXTAREA>
</F0RM>
window
<B0DY BGC0L0R="1ightgrey"
onBlur="document,bgColor='black'" on Foeus="document.bgColor='whi te'">
When calling a function from an event handler, passing along a copy of the object that’s involved is a great idea. You can do this by passing the this keyword; that way, you can keep your function code generic enough to reuse over and over again.
This code fragment, repeated from an earlier section, shows an example of this:
Last name: <INPUT TYPE="text" VALUE=""
NAME="1astName" SIZE=25 onBlur="verifyExistence(this. value) ”>
When a user blurs the 1 astName field, the JavaScript interpreter calls the verifyExistenceC) function and passes it th i s . va 1 ue. Instead of having to know what form element value to access in veri fyExi stence() (Yecch, hard coding! The root of all evil!), all you have to do in veri fy Exi stence() is work with the generic value passed in.
ftange
The onChange event handler is similar to onBl ur, except that onChangeis invoked only if some change has been made in the value of a sel ect, text, or textarea element, in addition to the loss of focus. Depending on your application, sometimes you may want to call the functions that do your field-level validation from an onChange event handler instead of from onBlur.That way, a value is verified only if it has changed, not just when a user moves
to a different area of the form. (Why go to all the trouble of revalidating a value if you know that the value hasn’t changed since the last time that you validated it?) See also “Validating User Input” in Part IX.
Syntax:
onChange="event handling text"
Example:
You can use the onChange event handler with the sel ect, text, and textarea form elements. The following sections contain examples of each event handler.
select
<F0RM>
Product: <SELECT NAME="productSelection" SIZE=1 onChange="processSelecti on(thi s) ">
<0PTI0N VALUE="keyring"> key ring <0PTI0N VALUE="sweat"> sweatshirt <0PTION VALUE="horn"> monogrammed shoehorn </SELECT>
text
Last name: <IN PUT TYPE = "text" VALUE=""
NAME="1astName" SIZE=25
onChange="veri fyExi stence(thi s.value) ">
textarea
CTEXTAREA NAME="commentField" R0WS=5 C0LS=50 onChange=*if (!this.value) { confirm('Are you sure you don't want to comment?')}">
</TEXTAREA>
</FORM)
onCtick
A browser invokes the on Cl i с к event handler when the user clicks on a clickable form element.
Navigator 3.0 enables you to stop an on Cl i с к event if your event handler code returns false (0). For example, the following code snippet allows users to change their minds after they click on the link and stop the link URL from loading if they press the “Cancel” button displayed by the conf i rm() method. (See also the “confirm” section in Part VI.)
<A HREF=”http://www.dummies.com" onClick="return confirm('Okay to go ahead and connect?' ) ">
Dummies Press Homepage </A>
OnClick
Internet Explorer 3.0 doesn’t support this feature at the time of this writing.
Syntax:
onClick-"event handling text"
Example:
You can use the onCl i с к event handler with all the following form elements: button, checkbox, link, radi o, reset, and submi t. The following sections contain examples of each.
button
<INPUT TYPE="button" NAME="orderNow” VALUE="order" onCli ck="tally0rder()">
Previous << 1 .. 45 46 47 48 49 50 < 51 > 52 53 54 55 56 57 .. 72 >> Next