Qual è il valore corretto per l'attributo disabilitato?


167

Qual è il valore corretto per l' disabledattributo per una casella di testo o un'area di testo?

Ho visto quanto segue usato prima:

<input type="text" disabled />
<input type="text" disabled="disabled" />
<input type="text" disabled="true" />

5
Gli attributi devono avere un valore, anche per gli attributi la cui semplice presenza segnala che bisogna fare qualcosa. disabled="false"disabiliterebbe comunque l'elemento, perché è la PRESENZA disabledche attiva la disabilitazione, non il valore dell'attributo.
— Marc B,

Il link che ho pubblicato come commento alla risposta di js1568 conferma / chiarisce cosa dice @Marc B: whatwg.org/specs/web-apps/current-work/multipage/…
— James Allardice,

possibile duplicato di stackoverflow.com/questions/1033944/… perché entrambi sono attributi booleani (non contrassegnati)
— Ciro Santilli 郝海东 冠状 病 六四 事件 法轮功

Risposte:


148
  • Per XHTML, <input type="text" disabled="disabled" />è il markup valido.
  • Per HTML5, <input type="text" disabled />è valido e utilizzato da W3C sui propri campioni.
  • In effetti, entrambi i modi funzionano su tutti i principali browser.

15
In html5, l'input è un elemento vuoto e non necessita di una barra che si chiude automaticamente: w3.org/TR/html5/syntax.html#void-elements e w3.org/TR/html5/syntax.html#syntax-start- tag
— Daniel

1
@Daniel K. Non ne ha bisogno, a meno che non esegua markup HTML / XML poliglotta.
— Patanjali,

108

Specifiche HTML5 :

http://www.w3.org/TR/html5/forms.html#enabling-and-disabling-form-controls:-the-disabled-attribute :

L'attributo del contenuto verificato è un attributo booleano

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

La presenza di un attributo booleano su un elemento rappresenta il valore vero e l'assenza dell'attributo rappresenta il valore falso.

Se l'attributo è presente, il suo valore deve essere la stringa vuota o un valore che corrisponde a una corrispondenza maiuscole / minuscole ASCII per il nome canonico dell'attributo, senza spazi bianchi iniziali o finali.

Conclusione :

Sono validi, equivalenti e veri :

<input type="text" disabled />
<input type="text" disabled="" />
<input type="text" disabled="disabled" />
<input type="text" disabled="DiSaBlEd" />

Non sono validi :

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

L'assenza dell'attributo è l'unica sintassi valida per false :

<input type="text" />

Raccomandazione

Se ti interessa scrivere XHTML valido, usa disabled="disabled", poiché <input disabled>non è valido e altre alternative sono meno leggibili. Altrimenti, usa solo <input disabled>perché è più corto.


3
Nota: se si utilizza AngularJS e si deve associare lo stato disabilitato a una variabile, è possibile utilizzare ng-disabledinvece. Simile con altri attributi come questo, generalmente hanno una ng-*controparte intelligente
— jakub.g

5
disabled={true}funziona con il codice JSX di reattJs ma sono sicuro che verrebbe trasferito in uno dei formati HTML5 validi / consentiti.
— RBT

1

Ho appena provato tutti questi, e per IE11, l'unica cosa che sembra funzionare è disabilitato = "vero". I valori di disabilitato o nessun valore dato non funzionavano. È un dato di fatto, il jsp ha ricevuto un errore che è uguale per tutti i campi, quindi ho dovuto specificare disabled = "true" per farlo funzionare.


1
La domanda di OP riguardava l'HTML (ovvero i controlli sul lato client). Stai guardando i controlli sul lato server; quelli hanno convenzioni diverse. Noterai la differenza se controlli l'output HTML dal tuo JSP. Se hai ancora dubbi, prova questo violino in IE11.
— Ruud Helderman,

Ho visto la stessa cosa sul lato client su Internet Explorer 11. IE 11 impone l'esistenza di qualcosa, quindi solo l'impostazione dei risultati disabilitati in disabled = ""
— Robert Achmann,

1

In HTML5, non esiste un valore corretto, tutti i principali browser non si preoccupano veramente dell'attributo, stanno solo controllando se l'attributo esiste, quindi l'elemento è disabilitato.

Utilizzando il nostro sito, riconosci di aver letto e compreso le nostre Informativa sui cookie e Informativa sulla privacy.
Licensed under cc by-sa 3.0 with attribution required.