CODEWITHSUNDEEP
jqueryhtml
scorpio1441
scorpio1441

Reputation: 3088

Ignore html,css and other code in textarea

Here is an example:

I write html code inside of textarea, then I swap its content with one of the div elements to see live changes (jquery). Happens vise versa, from div to textarea and back. There are two textareas: one for html another for css. Textarea for css is swapped with one of the elements. Sounds funny? =)

Long story short: when it comes to the point where I need to write <textarea>...</textarea> inside of html's textarea or write "textarea { font-style: bold; }" inside of css's textarea - THIS CODING is getting applied to my html and css textareas creating mess on swap.

How do I make textarea ignore what is inside of it and treat all content as text?

Swapping is done this way (actually it's much more complicated, but idea is the same):

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();

Wow! That was hard to explain. Are you confused?

Upvotes: 1

Views: 1711

Answers (2)

Simon
Simon

Reputation: 3539

You could use val()to set the content of the textarea instead of just concatenating the strings to set the current content as default value of the textarea:

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

You'll find an example here: http://jsfiddle.net/9SbGt/

Upvotes: 1

Christoph
Christoph

Reputation: 51201

Use "scoped" style-declaration (bad browsersupport) or iframes!

Upvotes: 0

Related Questions