Home | HTML Tutorials | JavaScript Editor

Get Advanced JavaScript and Ajax Editor, Validator and Debugger! 1st JavaScript Editor.

LABEL - Form Field Label

The LABEL element associates a label with a form control. By associating labels with form controls, authors give important hints to users of speech browsers while also allowing visual browsers to duplicate common GUI features (e.g., the ability to click on a text label to select a radio button or checkbox).

Each LABEL element is associated with exactly one form control. The element's content is the label of the form control and may include inline elements such as IMG and STRONG.

The FOR attribute explicitly specifies the control associated with the LABEL. The value of the FOR attribute must match the value of the associated form control's ID attribute. In the absence of the FOR attribute, the LABEL must contain the associated form control. This method of implicit association is convenient in many cases, but not an option when the form control and its label are in different table cells, paragraphs, or divisions. The following example illustrates both explicit and implicit label associations:

<TABLE>
  <TR>
    <TD>
      <LABEL FOR=user ACCESSKEY=U>User</LABEL>
    </TD>
    <TD>
      <SELECT NAME=user ID=user>
        <OPTION>Jean</OPTION>
        <OPTION>Kim</OPTION>
        <OPTION>Brian</OPTION>
      </SELECT>
    </TD>
  </TR>
  <TR>
    <TD><LABEL FOR=passwd ACCESSKEY=P>Password</LABEL></TD>
    <TD><INPUT TYPE=password NAME=password ID=passwd></TD>
  </TR>
</TABLE>
<P>
  <LABEL ACCESSKEY=S>
    <INPUT TYPE=checkbox NAME=save VALUE=yes>
    Save user name and password in a cookie
  </LABEL>
</P>
<P>
  <LABEL ACCESSKEY=C>
    Comments to post:
    <TEXTAREA NAME=comments ROWS=8 COLS=50></TEXTAREA>
  </LABEL>
</P>

The ACCESSKEY attribute, used throughout the preceding example, specifies a single Unicode character as a shortcut key for giving focus to the LABEL, which passes the focus on to the associated form control. Entities (e.g. é) may be used as the ACCESSKEY value.

The LABEL element also takes a number of attributes to specify client-side scripting actions for various events. In addition to the core events common to most elements, LABEL accepts the following event attributes:

• ONFOCUS, when the element receives focus;
• ONBLUR, when the element loses focus.

More Information

• LABEL in W3C HTML 4.0 Recommendation

Home | HTML Tutorials | JavaScript Editor

Get Advanced JavaScript and Ajax Editor, Validator and Debugger! 1st JavaScript Editor.