Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

is it autofocus="autofocus" or autofocus?

Tags:

html

autofocus

I seem to recall most (maybe all) attributes in previously versions of HTML (before HTML5) required attributes to have values, like readonly="readonly".

Is this true for HTML5 and the autofocus attribute?

like image 849
Darryl Hein Avatar asked Dec 15 '10 00:12

Darryl Hein


People also ask

What does autofocus mean?

Auto-focus is a feature of digital cameras that allows them to focus correctly on a subject. It enhances the quality of the photo over fixed-focus cameras and allows for close-ups (or the even closer macro shots). Phones use passive auto-focus with contrast measurement.

What is the use of autofocus?

An autofocus (or AF) optical system uses a sensor, a control system and a motor to focus on an automatically or manually selected point or area. An electronic rangefinder has a display instead of the motor; the adjustment of the optical system has to be done manually until indication.

What does autofocus mean in HTML?

Definition and Usage The autofocus attribute is a boolean attribute. When present, it specifies that the element should automatically get focus when the page loads.

What is autofocus in react?

Autofocus can make your app more convenient for users. For example, instead of clicking into a field before typing, they can immediately start typing as soon as a form loads.


2 Answers

In HTML, you use boolean attributes with or without values as you like. A boolean, for W3C, like autofocus can be written like that autofocus or autofocus="autofocus" or also autofocus="".

If you don't want autofocus just don't write it.

I think you are confused because XHTML requires values for all attributes: attributes="values".

Here is some information about boolean attribute use in HTML: http://www.whatwg.org/specs/web-apps/current-work/multipage/common-microsyntaxes.html#boolean-attribute

like image 141
Tim Avatar answered Oct 07 '22 00:10

Tim


Quoting the HTML5 spec and expanding a bit on Pekka:

http://www.w3.org/TR/html5/forms.html#autofocusing-a-form-control:-the-autofocus-attribute :

The autofocus attribute is a boolean attribute.

http://www.w3.org/TR/html5/infrastructure.html#boolean-attributes :

The presence of a boolean attribute on an element represents the true value, and the absence of the attribute represents the false value.

If the attribute is present, its value must either be the empty string or a value that is an ASCII case-insensitive match for the attribute's canonical name, with no leading or trailing whitespace.

Conclusion:

The following are valid, equivalent and true:

<input type="text" autofocus /> <input type="text" autofocus="" /> <input type="text" autofocus="autofocus" /> <input type="text" autofocus="AuToFoCuS" /> 

The following are invalid:

<input type="text" autofocus="0" /> <input type="text" autofocus="1" /> <input type="text" autofocus="false" /> <input type="text" autofocus="true" /> 

The absence of the attribute is the only valid syntax for false:

<input type="text"/> 

Recommendation

If you care about writing valid XHTML, use autofocus="autofocus", since <input autofocus> is invalid and other alternatives are less readable. Else, just use <input autofocus> as it is shorter.