仕様書

フォーム制御子系要素 disable 属性

[2] HTML のフォーム制御子系要素の disabled 属性は、 その制御子の利用者入力を無効にします。

[14]

要素型
button, input, optgroup, option, select, textarea, fieldsethttp://www.w3.org/1999/xhtml, optgrouphttp://www.w3.org/1999/xhtml, optionhttp://www.w3.org/1999/xhtml
属性名
disabled (disalbed (無効) より)
属性値
ブール型属性 (>>4)
既定値
偽 (>>4)

[3] 仕様書:

[11] HTML 4 DTD の注釈 (参考) には unavailable in this context と説明があります。

属性値

[4] この属性は真偽値属性です。指定すれば真 (無効)、 指定しなければ偽 (有効) です。

[5] この属性は継承しますが、局所宣言が継承値を上書きします HTML 4 17.12.1。 この規定が適用されるのは、メニュー選択制御子 (select) の場合と推定されます。

[15] fieldset が disabled されると、その子孫のフォーム制御子は、 すべて disabled となります。 WF2 2.5

UA による利用

[6] 無効化された制御子は、

[16] 利用者エージェントは、

を無効化しなければなりません。 WF2 2.5

[17] >>16 を厳密に解釈すると、 フォーム制御子でない option と optgroup と fieldset は無効化されず、 フォーム制御子である (が disabled は持たない) output は無効化されることになってしまいますが、 fieldset や output に対して有効・無効ということはあまり意味がありませんし、 option や optgroup は select の子孫でない限り、 やはり有効・無効にあまり意味はないので、 特に問題はなさそうです。

実装

[12] CSS Attribute selector bug - My Opera Forums http://my.opera.com/forums/showthread.php?threadid=96113

[18] IE7以下でもdisabled 属性を利用できるようになる「select-option-disabled-emulation.js」-JavaScript Library Archive ( 版) http://javascript.webcreativepark.net/library/select-option-disabled-emulation

他との関係

[7] HTML 的には有効・無効を動的に切り替える方法がなく、 スクリプトを使うことになっています。 HTML 4 17.12.1

[8] 似たような属性として readonly があります。利用者の入力を受け付けないという意味では disabled と同じですが、 readonly な制御子は成功するなどの違いがあります。

アクセス可能性・可用性・安全性

[10] この属性は、例えば、必須の項目が入力されるまで提出ボタンを無効にする、 といったような目的で使うことができます HTML 4 17.12.1。 しかし、 HTML だけでは有効・無効状態を動的に切り替えることができませんから、 その機能はスクリプトによって実現する必要があります。

このような場合、初期状態では必須の項目が未入力の状態であるとすると、 提出ボタンの初期状態も無効となるべきです。 従って、 HTML 文書に直接 <input type="submit" disabled> と指定しておきたくなります。しかし、 これは好ましくありません。なぜなら、 スクリプトが使えない UA やスクリプトを無効にしている利用者は、 この提出ボタンを押してフォームを提出しておくことができなくなってしまいます。

ですから、 HTML 文書の記述は

<input type="submit">

にとどめておき、スクリプトによって最初にこのボタンを無効化するという方法を採るべきです。

例

[9] 無効な文章入力制御子の例 HTML 4 17.12.1

<INPUT disabled name="fred" value="stone">

この例では、この制御子は通常レンダリングされますが、 利用者は編集できませんし、提出時に使われることもありません。

無効 fieldset

[21] fieldset 要素は、次の時無効fieldsetdisabled fieldsetです >>84。

実際に無効

定義

[71] 要素が実際に無効actually disabledであるとは、次の状態をいいます >>70。

  • [54] button 要素で無効なもの
  • [55] input 要素で無効なもの
  • [56] select 要素で無効なもの
  • [57] textarea 要素で無効なもの
  • [58] optgroup 要素で disabled 属性を持つもの
  • [59] option 要素で無効なもの
  • [60] command 要素で disabled 属性を持つもの
    • >>72 で削除
  • [61] li 要素で menu 要素の子供であって、命令を定義する子要素を持っており、かつそのような最初の要素の無効状態ファセットが真 (無効) であるもの
    • >>72 で削除
  • [74] menuitem 要素で disabled 属性を持つもの
    • >>72 で追加
  • [62] fieldset 要素で無効fieldsetであるもの

[68] <input type=hidden> には適用されないこととされていましたが、実装に合わせて >>67 で適用されるように変更されました。

用法

[75] この概念は :disabled/:enabled 擬似クラス (>>53) の定義とフォーカス可能性の定義で使われています。

:disabled 擬似クラス、:enabled 擬似クラス

[25] :enabled 擬似クラス、:disabled 擬似クラスは、利用者界面要素が有効である、または無効であることをそれぞれ表します >>24。

仕様書

  • [24] Selectors Level 3 ( 版) http://www.w3.org/TR/selectors/#enableddisabled
  • [39] HTML Standard ( 版) http://www.whatwg.org/specs/web-apps/current-work/#pseudo-classes

意味

[26] どの要素が利用者界面要素であるか、また有効であるか無効であるか、は文書言語によって定義されます >>24。

[27] CSS 的に利用者が操作可能であるか否かは有効・無効に直接影響しません。例えば 'display' や 'visibility' によってレンダリングの有無を指定し、 ひいては利用者が操作できなくすることができるかもしれませんが、それによって :enabled と :disabled の状態が変化するわけではありません。 >>24

HTML

[88] :enabled 擬似クラスは、次の要素のうち、 実際に無効でないものに一致します >>39。

  • button
  • input
  • select
  • textarea
  • optgroup
  • option
  • menuitem
  • fieldset

[40] :enabled 擬似クラスは次の要素と一致します >>39。

  • [41] a 要素で href 属性を持つもの
    • >>85 でコメント化
  • [42] area 要素で href 属性を持つもの
    • >>85 でコメント化
  • [43] link 要素で href 属性を持つもの
    • >>85 でコメント化
  • [44] button 要素で無効でないもの
  • [45] input 要素で無効でないもの
  • [46] select 要素で無効でないもの
  • [47] textarea 要素で無効でないもの
  • [48] optgroup 要素で disabled 属性を持たないもの
  • [49] option 要素で無効でないもの
  • [50] command 要素で disabled 属性を持たないもの
    • >>72 で削除
  • [51] li 要素で menu 要素の子供であって、命令を定義する子要素を持っており、かつそのような最初の要素の無効状態ファセットが偽 (無効でない) であるもの
    • >>72 で削除
  • [73] menuitem 要素で disabled 属性を持たないもの
    • >>72 で追加
  • [52] fieldset 要素で無効fieldsetであるもの

[53] :disabled 擬似クラスは実際に無効である要素 (>>71) と一致します >>39。

XForms

  • [28] XForms 1.1 ( 版) http://www.w3.org/TR/xforms/#N90079

[29] XForms では、 :enabled と :disabled はそれぞれフォーム制御子が関係あるrelevantまたは無関係non-relevantであることを表します。

歴史

選択子3

  • [30] User Interface Enhancements ( 版) http://www.w3.org/TR/1999/WD-css3-userint-19990916#pseudo-enabled
  • [31] User Interface for CSS3 ( 版) http://www.w3.org/TR/2000/WD-css3-userint-20000216#pseudo-enabled

[32] はじめこれらの WD で定義されていましたが、その後選択子3に移されたようです。

  • [37] CSS3 module: W3C Selectors ( 版) http://www.w3.org/TR/2000/WD-css3-selectors-20000410#enableddisabled

[66] その後の CSS3 UI は単に選択子3へのリンクになっています。

  • [65] CSS Basic User Interface Module Level 3 (CSS3 UI) (Tantek Çelik 著, 版) http://www.w3.org/TR/2012/WD-css3-ui-20120117/#pseudo-classes

XForms

  • [33] XForms and Styling ( 版) http://www.w3.org/TR/2002/WD-xforms-20020821/sliceF.html#id2641029

[34] XForms における定義は >>33 で追加されました。

Web Controls 1.0

[38] Webアプリケーションが状態を制御できるように拡張する構想もありました。

  • [36] Web Applications Markup Language 1.0 ( ( 版)) http://hixie.ch/specs/html/apps/web-apps-1#pseudo-classes
  • [35] Web Controls 1.0 ( ( 版)) http://www.whatwg.org/specs/web-controls/current-work/#pseudo-classes

HTML

[64] HTML に関してははじめ Web Forms 2.0 が、後に HTML Living Standard (Web Applications 1.0) が規定するようになりました。

  • [19] IRC logs: freenode / #whatwg / 20090610 ( 版) http://krijnhoetmer.nl/irc-logs/whatwg/20090610#l-124
  • [20] Web Forms 2.0 ( 版) http://www.whatwg.org/specs/web-forms/current-work/#disabled1
  • [22] Web Applications 1.0 r5398 Make :disabled accurately reflect <option> disabled state.Fixing http://www.w3.org/Bugs/Public/show_bug.cgi?id=10105 ( ( 版)) http://html5.org/tools/web-apps-tracker?from=5397&to=5398
  • [23] IRC logs: freenode / #whatwg / 20110118 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20110118#l-1039
  • [63] HTML Standard ( 版) http://www.whatwg.org/specs/web-apps/current-work/#pseudo-classes
  • [67] Web Applications 1.0 r7300 It doesn't make any sense, but browsers make :enabled/:disabled apply to <input type=hidden>, so, oh well. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=7299&to=7300
  • [72] Web Applications 1.0 r7602 Grand <menu> revamp. Note: This patch includes parser changes. ( 版) http://html5.org/tools/web-apps-tracker?from=7601&to=7602

実装

[13] Bug 84400 - Support :disabled and :enabled pseudo-classes https://bugzilla.mozilla.org/show_bug.cgi?id=84400 (名無しさん 2005-08-31 02:15:00 +00:00)

メモ

[69] Web Applications 1.0 r7498 Another attempt at defining tabindex, :disabled, what can be focused, etc. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=7497&to=7498

[76] Web Applications 1.0 r8390 Update how the interaction with CSS style sheets and CSSOM is defined. ( ( 版)) http://html5.org/tools/web-apps-tracker?from=8389&to=8390

[77] Bug 26622 – :enabled shouldn't match links, since they have no disabled state ( ( 版)) https://www.w3.org/Bugs/Public/show_bug.cgi?id=26622

[78] IRC logs: freenode / #whatwg / 20140903 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20140903#l-733

[79] Web Applications 1.0 r2778 Defined how pseudo-classes match HTML concepts. Redid how rtl/ltr changes are marked. Stopped <legend> centering for <figure>. Removed <multicol> support. Removed <basefont> support. Removed obsolete notes. Fixed minor typos. ( ( 版)) http://html5.org/r/2778

[80] IRC logs: freenode / #whatwg / 20140903 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20140903#l-733

[81] Web Applications 1.0 r8746 Try to clarify 'form control is disabled'. ( ( 版)) http://html5.org/r/8746

[1] Web Applications 1.0 r8753 Make sure :disabled matches fieldsets inside disabled fieldsets, since apparently that's a thing. Also, editorial cleanup around 'disabled'. ( 版) http://html5.org/r/8753

[85] Web Applications 1.0 r8818 Make :enabled not match <a href> ( 版) https://html5.org/r/8818

[86] 28673 – Anchors should be disable-able ( 版) https://www.w3.org/Bugs/Public/show_bug.cgi?id=28673

[87] Define :enabled by reference to "actually disabled" (gibson042著, ) https://github.com/whatwg/html/commit/881985545c6c5edc8a19a72a8249dcbe5e7c5d61

[89] Editorial: "actually disabled" is also used for :enabled now (annevk著, ) https://github.com/whatwg/html/commit/ac87672aa0c840ac5ff810c5ed39c5523923d17a

[90] Non-normative note about disabled controls disallows selection · Issue #1852 · whatwg/html () https://github.com/whatwg/html/issues/1852

[91] Clarify the difference between disabled and readonly (domenic著, ) https://github.com/whatwg/html/commit/5918513a6662afc3e94073498a1755a39bb98e9b

[92] Clarify and add some examples around focus (domenic著, ) https://github.com/whatwg/html/commit/deb83668390151a2cf242c24dd9d68509860e77a

[93] Remove the context menu feature (domenic著, ) https://github.com/whatwg/html/commit/e7e8c88ecdd7cdc96171f05ab6fe23b56dd48d8a

[94] Clarify disabled for option/optgroup is defined separately (annevk著, ) https://github.com/whatwg/html/commit/8d60f070d6ba6b5c7dfbc116fd9d3faee5d9c96e

[95] Clarify disabled for option/optgroup is defined separately by annevk · Pull Request #3415 · whatwg/html () https://github.com/whatwg/html/pull/3415

[96] Editorial: attribute domintro/index tweaks (domenic著, ) https://github.com/whatwg/html/commit/39098184f795a75887239af5a34d812f2994dd95