ここ - 優秀な図書館

TEXTAREAにHTML、CSS、および他のコードを無視する例を示します。ここ

私は私がライブ変更（jqueryの）を参照するdiv要素の一つと、そのコンテンツを交換、TEXTAREAの内部HTMLコードを書きます。 divからtextareaに戻り、また戻る。 2つのテキストエリアがあります：1つはHTML用、もう1つはCSS用です。 CSSのTextAreaは要素の1つと入れ替えられます。面白い？ =）

私は、<textarea>...</textarea>をhtmlのテキストエリアに書き込むか、CSSのテキストエリアに「textarea {font-style：bold;}」と書いてください。私のHTMLとCSSのテキストエリアはスワップを混乱させます。

テキストエリア内の内容を無視してすべてのコンテンツをテキストとして扱うにはどうすればよいですか？

スワッピングがこのように行われている（実際にははるかに複雑だが、考え方は同じです）：

var html = $('.content').html(); 
$('.editors').append("<textarea class='editorhtml' spellcheck='false'>"+html+"</textarea>"); // .editors is outside of .content 

//and 

$('.content').html($('.editorhtml').val()); 
$('.editorhtml').remove();

うわー！それは説明するのが難しいです。混乱していますか？

あなたがテキストエリアの内容を設定するために val()を使うだけではなくテキストエリアのデフォルト値として現在のコンテンツを設定する文字列を連結することができ

出典

2012-02-06 Alex G

_説明が難しく**理解しづらい** ** JSFiddle **はどうですか？ – gdoron

あなたはそこにあります。私は混乱しています。あなたがリンクを投稿した場合、私たちはライブ –

を見ることができたあなたは非常にいいですが、例がより便利になります。 – Murtaza

：あなたがここに例を見つけることができます

var html = $('.content').html(); 
$("<textarea class='editorhtml' spellcheck='false'>").val(html).appendTo($('.editors'));

：http://jsfiddle.net/9SbGt/

を

出典

2012-02-06 08:36:20 Simon

私はそれを.contentのテキストとして使う必要はありません。私はそれを実際のhtmlにしたいと思います。 –

申し訳ありませんが、あなたの質問が間違っています。あなたのフィドルは本当に助けます。私の編集された答えを参照してください – Simon

良い！これはhtml用です。 CSSで何をするかtextarea {font-style：bold; }はeditorhtmlに適用されていますか？太字は文書の一部になり、すべてのテキストエリアに適用されます。回避策はありますか？ありがとう。 –

「スコープ付き」スタイル宣言（悪いブラウザーサポート）またはiframeを使用してください！

出典

2012-02-06 08:55:46 Christoph

それは私だけではない。サイトにアクセスできる人もいれば、スタイルも混乱する可能性があります。どのようにタグ内のタグエリアですか？ iframeはhtml5 + jqueryから離れています！ –

なぜiframeはhtml5から離れていますか？私は本当にそれを理解していない。 jsfiddleをチェックして、彼らはあなたのスタイルをカプセル化するのに最適なIframeも使用します。 – Christoph

特定の構造はiframeを使用できません。私が試しても、すべてをやり直すには何時間もかかるでしょう。 Textarea要素が指定以外の他のすべてのスタイルを無視するjqueryトリックについてはどうでしょうか？ –

ここ

答えて

関連する問題