6

テキストエリアやiframeを介さずに、ページを直接編集できるGoogleドキュメントに似たものを作成しようとしています。これは、contentEditableHTML5属性で可能です。

では、contentEditableの上で、テキストの書式設定、リンクの挿入、単語からの貼り付けなどの機能を提供するために使用できる優れたエディターはありますか?

http://www.aloha-editor.org/は私が見つけたものですが、もっとあるのではないかと思っていました。

(編集:Googleドキュメント全体を作成しようとしているのではなく、実際のコンテンツを編集する例として使用したことを明確にする必要があります)

4

2 に答える 2

1

WYMeditorのバージョン2.0 (現在私や他の人が開発中)もcontentEditableを使用していますが、designModeとcontenteEditable APIの動作はブラウザベンダー間で大きく異なるため、主に選択/範囲/操作のドームに依存しています。

機能/設計目標のいくつかは次のとおりです。

  • WYSIWYM編集–コンテンツとプレゼンテーションを分離することで、リッチテキスト形式を有効にしますが、プレゼンテーションはデザイナーに任せます。

  • モジュラーアーキテクチャ–必要なコンポーネントのみを使用する(そしてそれらを独自のUIに接続する)か、ツールバー、ダイアログ、その他すべてを備えた「フルスタック」エディターにドロップします。

  • 厳密なxHTML(5) –エディターはデフォルトで厳密なXHTMLを出力します(必要に応じてコンテンツを簡単に変換できるようにします)。それがあなたが望むものでない場合、あなたはあなたが望むどんなフォーマットをもサポートするためにあなた自身のパーサーとシリアライザーを書くことができます。

  • プレースホルダー/カスタム要素–プレースホルダー、さらにはカスタム要素を使用すると、エディター内のほぼすべての種類のコンテンツを管理できます。StructureValidatorと一緒に、ネスト、フォーマット、有効な属性などのルールを適用できます。

ソースはGitHubで入手でき、最初のベータ版は1〜2か月以内にリリースされる予定です。

于 2011-03-24T20:15:40.877 に答える
1

HTML5 editorを見てください。textarea 要素を取り、それを contentEditable を持つ div に変換します。コンテンツを簡単にフォーマットするためのかなりカスタマイズ可能なツールバーがあります。

于 2012-07-12T14:52:50.660 に答える