Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

What's the "for" for in a label tag?

Just ran across a for parameter in an HTML label tag:

<label for="required-firstname"> First Name </label> <small>*</small> <input name="required-firstname" type="text" tabindex="2"         id="required-firstname" size="24" maxlength="40"> 

I'm converting this form to a PHP processed script, can I get rid of the for= parameters? (And out of curiosity, what does it do?)

like image 765
lynn Avatar asked Mar 30 '09 16:03

lynn


People also ask

What does the for in label tag mean?

The for attribute specifies which form element the label is bound to. The label element allows the user to give focus to a form element by clicking on an associate label. If you do not use the for attribute, this association will not be made.

What is for in label for?

The for attribute associates the label with a control element, as defined in the description of label in the HTML 4.01 spec. This implies, among other things, that when the label element receives focus (e.g. by being clicked on), it passes the focus on to its associated control.

What's for in label tag in HTML?

HTML <label> tag When writing in HTML, the <label> tag is used to create labels for items in a user interface. Used within <input> tags on a form, the <label> tag is additionally useful because it extends the clickable area of control elements, like buttons.

Is for necessary in label?

by definition a label still needs to be 'for' something right? Yes, but that doesn't mean the for attribute is required. For example, if the input is nested inside the label, the label is “for” that input implicitly.


1 Answers

From w3schools.org:

The tag defines a label for an input element.

The label element does not render as anything special for the user. However, it provides a usability improvement for mouse users, because if the user clicks on the text within the label element, it toggles the control.

The for attribute of the tag should be equal to the id attribute of the related element to bind them together.

HTH!

adding my $.02 as an Accessibility SME - as well as usability, the LABEL also associates the input field with the correct label so persons using screen readers will know what the field is for.

like image 119
Jonas Avatar answered Sep 30 '22 04:09

Jonas