contentEditable

contenteditable 属性 (HTML)

[19] contenteditable 属性は、 editing host を作成するものです。

仕様書

意味

[33] contenteditable 属性は、要素利用者によって編集可能かどうかを指定します。

[34] ここでいう編集可能というのは、WYSIWYG 編集モード (editing host) のことです。 input 要素textarea 要素のようなフォーム制御子とは異なります。

属性値

[24] contenteditable 内容属性は、列挙属性です。 次の状態を持ちます。 >>27

kwd
キーワード
state
状態
semantics
意味
kwd
空文字列true
state
(true)
semantics
要素は編集可能である
kwd
false
state
(false)
semantics
要素は編集可能ではない
kwd
欠値既定値非妥当値既定値
state
継承 (inherit)
semantics
要素が編集可能かどうかは次第

[26] つまり、 contenteditablecontenteditable=true は同義で、 編集可能であることを表します。 contenteditable=false はそうでないことを表します。 属性が指定されない時は contenteditable 属性を持つ直近の祖先と同じです。

[58] contenteditable=false を使って、全体としては編集可能でも、 子孫の一部分だけを編集不能とすることができます。

[59] 例えば編集可能領域の中に図表ブロックを挿入して、図表内は編集不能とすることができます。 利用者は図表の周りに好きに文章を書いたり、図表自体を削除したりすることはできますが、 図表内部は変更することができません。

[60] 図表の中の更に一部、グラフのラベル部分のみ contenteditable=true に設定するようなこともできます。

[42] 属性値は、 ASCII大文字・小文字不区別です。

文脈

[25] contenteditable 内容属性は、任意のHTML要素に指定できます。

[61] 実際にはほとんど意味のない要素もあります。 br 要素textarea 要素head 要素script 要素などでは効果がありません。

ElementContentEditable インターフェイス

[28] ElementContentEditable インターフェイスは、 contentEditableisContentEditable の2つのIDL属性を持ちます。 >>27

[29] ElementContentEditable インターフェイスは、 NoInterfaceObject です。 >>27

[32] ElementContentEditable は、 HTMLElement実装します。 HTML Standard つまり、 HTML要素に両IDL属性が存在します。

[30] contentEditable IDL属性は、 CEReactions です。 >>27

[35] 取得器は、次のようにしなければなりません >>27

  1. [36] 文脈オブジェクトcontenteditable 内容属性状態なら、
    1. [37] true を返します。
  2. [38] それ以外で、文脈オブジェクトcontenteditable 内容属性状態なら、
    1. [39] false を返します。
  3. [40] それ以外なら、
    1. [41] inherit を返します。

[43] 設定器は、次のようにしなければなりません >>27

  1. [52] 新しい値を、指定された値を DOMString と解釈した結果に設定します。
  2. [44] 新しい値ASCII大文字・小文字不区別inherit なら、
    1. [45] 文脈オブジェクトcontenteditable 内容属性削除します。
  3. [46] それ以外で、新しい値ASCII大文字・小文字不区別true なら、
    1. [48] 文脈オブジェクトcontenteditable 内容属性を、 true設定します。
  4. [49] それ以外で、新しい値ASCII大文字・小文字不区別false なら、
    1. [47] 文脈オブジェクトcontenteditable 内容属性を、 false設定します。
  5. [50] それ以外なら、
    1. [51] SyntaxError 例外投げます。

[31] isContentEditable IDL属性取得器は、 次のようにしなければなりません>>27

  1. [53] 文脈オブジェクトediting host か、 文脈オブジェクトeditable なら、
    1. [54] を返します。
  2. [55] それ以外なら、
    1. [56] を返します。

処理

[57] editing host 参照。

問題

[23] editing host 参照。

歴史

[18] Internet Explorer 5.5 を使った 編集可能な Web ページの作成方法 ( 版) http://www.microsoft.com/japan/msdn/web/html/mshtml/createwp.aspx#createwp_topic3

[1] Safari: 1.3 以上で contenteditabledesignMode に対応。

[2] Web Applications 1.0 http://www.whatwg.org/specs/web-apps/current-work/#contenteditable

[3] CONTENTEDITABLE Attribute | contentEditable Property (defaults, A, ACRONYM, ...) (Internet Explorer - DHTML) http://msdn.microsoft.com/workshop/author/dhtml/reference/properties/contenteditable.asp

[4] >>2 によれば標準の値はtruefalse>>3 によればWinIE 5.5とそれ以降では更にinheritも実装。 >>3 中の使用例に拠れば <element-type contentEditable>のように省略形にもできる。

解説サイトの中にはcontentEditable="yes"を紹介しているところもある。根拠不明。

[20] Internet Explorer 5.5 を使った 編集可能な Web ページの作成方法 (2007-04-07 13:42:05 +09:00 版) http://www.microsoft.com/japan/msdn/web/html/mshtml/createwp.aspx#createwp_topic3

[22] contentEditable のサポート - えむもじら (2007-07-06 22:13:00 +09:00 版) http://level.s69.xrea.com/mozilla/index.cgi?id=20070705_contentEditable

[414] contentEditable の不完全な対応 - A blog? with Σαιτω (2008-02-09 23:15:11 +09:00 版) http://d.hatena.ne.jp/saiton/20080209/1202566454

[5] Re: several messages about contentEditable, text selection, and related subjects from Ian Hickson on 2008-03-09 (public-html@w3.org from March 2008) (Ian Hickson (ian@hixie.ch) 著, 2008-03-09 20:30:01 +09:00 版) http://lists.w3.org/Archives/Public/public-html/2008Mar/0037.html

[415] Web Applications 1.0 ― contentEditable and disabled (2005-07-21 07:00:00 +09:00 版) http://annevankesteren.nl/projects/whatwg/spec (名無しさん)

[416] contentEditable - block breaks ( 版) http://web.archive.org/web/20060305151716/jorgenhorstink.nl/projects/whatwg/blockbreak.htm (名無しさん)

[417] IRC logs: freenode / #whatwg / 20100813 ( 版) http://krijnhoetmer.nl/irc-logs/whatwg/20100813#l-567

[418] [whatwg] [editing] Proposal: Undeletable elements within contentEditable ( ( 版)) http://lists.whatwg.org/htdig.cgi/whatwg-whatwg.org/2011-July/032649.html

[419] Web Applications 1.0 r6528 Remove Editing APIs and related sections in favour of http://aryeh.name/spec/editing/editing.html ( ( 版)) http://html5.org/tools/web-apps-tracker?from=6527&to=6528

[420] Google Documentの入力欄を僕達はまだ知らない。 - Google Docs ( ( 版)) https://docs.google.com/document/d/1RRBJqK9TPGFA5pQPnafDTa0VWKq6Wh9DNiKjsLaZ63U/edit?pli=1

[421] IRC logs: freenode / #whatwg / 20120112 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20120112

[422] [whatwg] Should editable elements have placeholder attribute? ( ( 版)) http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2012-August/037044.html

[423] Bug 14554 – Consider adding support for contenteditable=plaintext ( ( 版)) https://www.w3.org/Bugs/Public/show_bug.cgi?id=14554

[424] [whatwg] Submitting contentEditable Content In A Form ( ( 版)) http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2012-October/037680.html

[425] [whatwg] Submitting contentEditable Content In A Form ( ( 版)) http://lists.whatwg.org/pipermail/whatwg-whatwg.org/2012-December/038426.html

[426] First Draft of HTML Editing APIs published by HTML Editing APIs Community Group [via HTML Editing APIs] ( (Search Team 著, 版)) http://lists.w3.org/Archives/Public/public-editing/2012Apr/0000.html

[427] [editing] nested contenteditable ( (Johannes Wilm 著, 版)) http://lists.w3.org/Archives/Public/public-webapps/2013AprJun/0790.html

[428] IRC logs: freenode / #whatwg / 20130607 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20130607#l-689

[429] IRC logs: freenode / #whatwg / 20130703 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20130703

[430] IRC logs: freenode / #whatwg / 20130704 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20130704#l-436

[431] HTML Editing APIs ( ( 版)) https://dvcs.w3.org/hg/editing/raw-file/tip/editing.html

[432] Internet Explorer 11 で contenteditable 属性や maxlength 属性を設定した要素で日本語入力ができないことがある ( ( 版)) http://support.microsoft.com/kb/2922126/ja

[433] [Editing] Splitting Selection API Into a Separate Specification ( (Ryosuke Niwa 著, 版)) http://lists.w3.org/Archives/Public/public-webapps/2014JanMar/0627.html

[434] IRC logs: freenode / #whatwg / 20140325 ( ( 版)) http://krijnhoetmer.nl/irc-logs/whatwg/20140325#l-636

[435] Web Applications 1.0 r8788 Split off contentEditable DOM aspects for resuse elsewhere. ( ( 版)) https://html5.org/r/8788

[8] ContentEditableTrue ( 版) https://w3c.github.io/editing/contentEditableTrue.html

[9] ContentEditableTyping ( 版) https://w3c.github.io/editing/contentEditableTyping.html

[10] first step, different types of cE · w3c/editing@60e5f95 ( 版) https://github.com/w3c/editing/commit/60e5f95d27ba21dceb18ea1c70cb652f127ec6e1

[11] add cE states to contentEditable.html · w3c/editing@c7df19c ( 版) https://github.com/w3c/editing/commit/c7df19ca42d1ee648b83327d4046eda0b4a53a49

[12] move definitions from cE=events -> cE document · w3c/editing@7cbb113 ( 版) https://github.com/w3c/editing/commit/7cbb11365817e2f6636c3bb4b3b997ccb8cf2f93

[13] clean up and merge existing docs · w3c/editing@37a1e19 ( 版) https://github.com/w3c/editing/commit/37a1e19325b43679aa16f1265a182d59f770b167

[14] Remove ContentEditableTrue since it doesn't have any content per 1/7 … · w3c/editing@af4b7f0 ( 版) https://github.com/w3c/editing/commit/af4b7f04ee0ac130cb87380548a7f8536c80835d

[15] Re: time at TPAC other than Wednesday? (Ryosuke Niwa 著, 版) https://lists.w3.org/Archives/Public/public-webapps/2016JanMar/0021.html

[16] Revert "Remove ContentEditableTrue" · w3c/editing@a51494e ( 版) https://github.com/w3c/editing/commit/a51494e83123c86ca952fcf853210977978d1ded

[17] added issue regardingng need of contentEditable=True spec · w3c/editing@c8e6667 ( 版) https://github.com/w3c/editing/commit/c8e666784f9b815a9335c63b1e29f4ea0743aba5

[21] 52800 - No visual aids for image and table editing - chromium - Monorail () https://bugs.chromium.org/p/chromium/issues/detail?id=52800

[62] add plaintext-only to list of editing host states (johanneswilm著, ) https://github.com/w3c/editing/commit/e23f29c1025cf1516090037c217bbc05a5ff3352

[63] Move inputmode to not be dependent on forms · Issue #1897 · whatwg/html () https://github.com/whatwg/html/issues/1897

[64] Remove inputmode · Issue #3077 · whatwg/html () https://github.com/whatwg/html/issues/3077

[65] Refine the inputmode attribute, exposing it on contenteditable. by dtapuska · Pull Request #3260 · whatwg/html () https://github.com/whatwg/html/pull/3260

[66] Use Web IDL's new-ish interface mixins concept (romandev著, ) https://github.com/whatwg/html/commit/c8867a179c21134021dc3435e98c1b9c4542d794

[67] Add the enterkeyhint="" attribute (dtapuska著, ) https://github.com/whatwg/html/commit/a5422d984d9b7b8a4e0ad7a0ad237b07f190cc93

[68] Relationship to HTML · Issue #2 · w3c/contentEditable () https://github.com/w3c/contentEditable/issues/2

[69] w3c/contentEditable () https://github.com/w3c/contentEditable

[70] ContentEditable () https://w3c.github.io/contentEditable/

[71] 「動画説明文」のHTMLエディタの挙動を変更しました【PC版ニコニコ動画】|ニコニコインフォ () https://blog.nicovideo.jp/niconews/139635.html?ref=video_watch_html5_marquee

説明文をコピー&ペーストする際に、意図しないスタイルがペーストされないよう、改行タグ以外のスタイルを反映しないよう変更しました。

これまで、動画説明文を他サイトなどからコピー&ペーストした際に、カラーコードなどのスタイルも反映されておりました。

[72] ContentEditable - HTML Editing APIs (, ) https://www.w3.org/community/editing/wiki/ContentEditable.html