webdevqa.jp.net

textarea内のHTML5リッチテキスト

新しいHTML5はリッチテキスト機能をtextareasに追加することで(より柔軟になります)、非常に厄介なJavaScriptを使用せずにコード構文強調表示エディターなど(iframeの作成など)を実行できると聞きました。

これは本当ですか?それをサポートするブラウザはまだありますか?また、APIはどこにありますか?

11
Alex

いいえ-jQuery

(私と同じ)探しているものがNO-jqueryツール(純粋なHTML/CSS +基本的なJS)である場合、私が見つけた最良のオプションのいくつかは次のとおりです。

  1. wysihtml5
  2. 従者
  3. ckeditor
  4. widgEditor

それにもかかわらず、上記のリストにあるものはすべて要素(textarea)をiframeに変換するので、私が探していたものと完全には一致しませんでした。元の要素を尊重するこれを見つけました(divsなどですが、textareaを使用すると追加のdivが作成されます)、完全な単純なJSアプリ開発が可能になります:

  1. nicedit

これがあなたにも役立つことを願っています!

6
DavidTaubmann

Aloha Editor をお探しですか?

新しいcontenteditable属性を使用して、選択したdivにWYSIWYGエディターを追加しています。

demos を見てください。

5

あなたが言及しているのは、新しいcontentEditable属性だと思います。これはテキストエリアではなく、要素の属性です。これはコンテンツの変更を許可するのに適しています。

試してみてください http://html5demos.com/contenteditable

お使いのブラウザでは、太字、斜体などのツールバーが表示されない可能性があります。ただし、chromeでは、テキストを選択してCTR-B、CTR-Iなどを使用できます。これで解決されます。

基本的に、それは進行中の作業であり、ブラウザーの互換性のための最善の策は、tinymceらのようなwysiwygエディターを使用することです。

3
Daniel Moses

どこで聞いたの? W3Schools> HTML5> textarea を見ると、これが正しいことを示唆するものは何も見当たりません。

Edit:w3schoolsを嫌う人のコメントのためにリンクを追加しました

この時点でも基本的には同じですが、ここに wiki textareaのw3.orgへのリンクと、text-areaの spec があります。また、これは differences がhtml 4および5のドキュメントです(2012年3月29日現在)。

2
MilkyWayJoe