is it autofocus="autofocus" or autofocus?

HtmlAutofocus

Html Problem Overview


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?

Html Solutions


Solution 1 - Html

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

Solution 2 - Html

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.

Solution 3 - Html

No, it's enough to specify the attribute itself. It was that way also in HTML 4.

> A number of attributes are 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.

Example:

<label><input type=checkbox checked name=cheese disabled> Cheese</label>

Attributions

All content for this solution is sourced from the original question on Stackoverflow.

The content on this page is licensed under the Attribution-ShareAlike 4.0 International (CC BY-SA 4.0) license.

Content TypeOriginal AuthorOriginal Content on Stackoverflow
QuestionDarryl HeinView Question on Stackoverflow
Solution 1 - HtmlTimView Answer on Stackoverflow
Solution 2 - HtmlCiro Santilli Путлер Капут 六四事View Answer on Stackoverflow
Solution 3 - HtmlPekkaView Answer on Stackoverflow