2011-10-16 7 views
5

太字、下線、三角または斜体でテキストエリアのテキストを書式設定できるコードがあります。しかし、実際に書式を設定する代わりにhtmlタグを表示します。私は一度divの中に出力するとわかっていますが、フォーマットが間違っていますが、ユーザーがテキストを書いている間に書式を表示したいと思います。テキストエリア内でHTMLフォーマットを表示するにはどうすればよいですか?

フォーマットを有効にするにはどうすればよいですか? JavaScriptは問題ありません。私は現時点でJQueryを使用しています。別のオプションがある場合は、WYSIWYGエディタを使用しないでください。

ありがとうございました。

答えて

0

テキストエリアの代わりにdivやその他のスタイル可能なhtml要素を使用することによってのみ可能と考えています。 Javascriptを使用すると、テキストエリアの機能を追加できます。

あなたはここのようないくつかの書式設定システムを使用していますか?私の意見では、疑似WYSIWYGよりはるかにエレガントです。

0

Textareaの内部で行うことができますので、wysiwygエディタなどを作成する必要があります。そのうちの1つを自分で作るのはかなり簡単です。 これはかなり良いチュートリアルです:DIV要素

<div contentEditable="true"> 
</div 

Devgurus wysiwyg tutorial

14

使用のcontentEditable属性は、任意の所望の方法で、あなたの入力をフォーマットすることができますこの方法では、単にデータを適切にエスケープし忘れてはいけません。

+0

これはHTML5をサポートしているブラウザの場合にのみ有効ですが、クロスブラウザの信頼性は解決しません。 – MacMac

+3

@lolwut: 'contentEditable'は、かなりの時間(http://caniuse.com/contenteditable)のすべての主要(デスクトップ)ブラウザでサポートされています。 – You

2

単なる考えです。ユーザーに自分のレスポンスがどのように表示されるかを見せたいだけなら、このサイトから手がかりを得て、コメントボックスの上/下に一種の「プレビュー」divを置くことができます。 onKeyUpを使用してdivにコードを入れて、ユーザーの入力時に日付を保持することができます。それは完璧ではありませんが、あなたがWYSIWYGを使いたくない場合は、おそらくあなたが得られるほど良いでしょう。

つまり、contentEditable + WYSIWYGオプションはおそらくユーザーフレンドリーで、もっと簡単なIMHOです。

関連する問題