disabled属性の正しい値は何ですか?


167

disabledテキストボックスまたはテキストエリアの属性の正しい値は何ですか?

以前に以下が使用されているのを見ました:

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

5
単なる存在が何かを行う必要があることを示す属性であっても、属性には値が必要です。disabled="false"要素が無効になるのdisabledは、属性の値ではなく、その存在が無効化をトリガーするためです。
Marc B

:私は@Marc Bが言っていることjs1568の答えの確認/明確化へのコメントとして投稿リンクwhatwg.org/specs/web-apps/current-work/multipage/...
ジェームズAllardice

stackoverflow.com/questions/1033944/…の重複の可能性があります。どちらもブール属性(フラグが付けられていない)であるためです
Ciro Santilli郝海东冠状病六四事件法轮機能

回答:


148
  • XHTMLの場合、<input type="text" disabled="disabled" />は有効なマークアップです。
  • HTML5の場合、これ<input type="text" disabled />は有効であり、サンプルでW3Cによって使用されます。
  • 実際、どちらの方法もすべての主要なブラウザで機能します。

15
html5では、入力はvoid要素であり、自動終了スラッシュは必要ありません。w3.org / TR
ダニエル

1
@Daniel K. polyglot HTML / XMLマークアップを行わない限り、それは必要ありません。
Patanjali 2016

108

HTML5仕様

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

チェックされたコンテンツ属性はブール属性です

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

要素にブール属性が存在することは真の値を表し、属性が存在しないことは偽の値を表します。

属性が存在する場合、その値は、空の文字列、またはASCIIの大文字と小文字を区別せずに属性の正規名と一致する値である必要があり、先頭または末尾に空白はありません。

結論

以下は有効で、同等で、trueです

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

以下は無効です:

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

属性がない場合は、falseの唯一の有効な構文です。

<input type="text" />

勧告

有効なXHTML、使用を書くことを気にしている場合disabled="disabled"以来、<input disabled>無効であり、他の選択肢は読みにくくしています。それ以外の<input disabled>場合は、短いので使用してください。


3
注:AngularJSを使用していて、無効状態を変数にバインドする必要がある場合は、ng-disabled代わりに使用できます。このような他の属性と同様に、一般的にそれらはインテリジェントなng-*対応物を持っています
jakub.g '11年

5
disabled={true}reactJs JSXコードで動作しますが、有効/許可されたHTML5形式のいずれかに変換されると確信しています。
2017年

1

私はこれらすべてを試してみましたが、IE11の場合、動作しているように見えるのはdisabled = "true"だけです。無効の値または指定された値が機能しませんでした。実際のところ、JSPはすべてのフィールドに等しい必要があるというエラーを取得したため、これを機能させるためにdisabled = "true"を指定する必要がありました。


1
OPの質問はHTML(つまり、クライアント側のコントロール)に関するものでした。サーバー側のコントロールを見ています。これらには異なる規則があります。JSPによるHTML出力を調べると、違いがわかります。それでも疑問がある場合は、IE11でこのフィドルを試してください。
Ruud Helderman、2016年

IE 11のクライアント側でも同じことがわかりました。IE 11は何かを強制的に存在させるので、無効に設定するだけでdisabled = ""になります
Robert Achmann

1

HTML5では、正しい値はありません。すべての主要なブラウザーは属性が何であるかを気にしません。属性が存在するかどうかをチェックするだけなので、要素は無効になります。

弊社のサイトを使用することにより、あなたは弊社のクッキーポリシーおよびプライバシーポリシーを読み、理解したものとみなされます。
Licensed under cc by-sa 3.0 with attribution required.