HTML and CSS Reference
In-Depth Information
When the user clicks an image field, the x and y coordinates of the point where the user
clicked are submitted to the server. The data is submitted as
name.x = x coord
and
name.y = y coord
, where
name
is the name assigned to the control. Using the preceding
code, the result might look like the following:
submitoformbtn.x=150&submitformbtn.y=200
You can omit the name if you choose. If you do so, the coordinates returned would just
be
x =
and
y =
. Form controls with the type
image
support all the attributes of the
<img>
tag. You can also use the same CSS properties you would use with
<img>
tags to modify
the appearance and spacing of the button. To refresh your memory on the attributes sup-
ported by the
<img>
tag, go back to Lesson 9, “Adding Images, Color, and Backgrounds.”
Creating Generic Buttons
In addition to creating Submit, Reset, and Image buttons, you also can create buttons that
generate events within the browser that can be tied to client-side scripts. To create such a
button, set the
type
attribute to
button
. Figure 11.10 shows a button that calls a function
when it is pressed. Use the following code to create a button:
Input
▼
<input type=“button” name=“verify” value=“verify” onclick=“verifydata()” />
.
Output
FIGURE 11.10
A button element
on a web page.
This example creates a button that runs a function called
verifydata
when it's clicked.
You provide the label that appears on the button with the
value
attribute of
Verify Data
.
Unlike Submit buttons, regular buttons don't submit the form when they're clicked. I
explain the
onclick
attribute when you get to Lesson 14, “Introducing JavaScript.”
