问题
I have this code:
<textarea><b>test</b></textrea>
It displays the raw HTML code. Instead, I would like it to simply display bold text.
How can I achieve that?
回答1:
If you want the textarea to display bold text, you can do that via css style attribute:
<textarea style="font-weight: bold">test-text</textarea>
This makes the textarea display all text bold, as it would be in <b>text</b>.
However, this affects all text in the textarea. There is no way to show only one word in bold.
回答2:
In order to display styled HTML instead of the pure HTML code inside a textarea, you need a JavaScript WYSIWYG editor. You can choose from many different ones, I can think of two right now: CKEditor and TinyMCE, though you can find many more. Please refer to the documentation of each one to learn about how to integrate it in your application. Read the information on their websites to decide which one suits you best.
Just to let you have a quick start, here's an example of how to easily integrate the ones I mention.
CKEditor
First, place the downloaded CKEditor package in your application's document root, so that you can access the file /ckeditor/ckeditor.js.
On the page with the textarea, add this code:
<script src="/ckeditor/ckeditor.js"></script>
<script>
window.onload = function () {
CKEDITOR.replaceAll('wysiwyg');
};
</script>
Finally, make sure the textarea in question has the wysiwyg class:
<textarea class="wysiwyg"><strong>test</strong></textarea>
TinyMCE
Again, download the package and put it somewhere in the docroot, so that the file /tinymce/tiny_mce.js is accessible.
Add this piece of code in the file containing the textarea:
<script src="/tinymce/tiny_mce.js"></script>
<script>
window.onload = function () {
tinyMCE.init({
mode: "textareas"
});
};
</script>
If you've set everything up correctly, you should get a WYSIWYG editor instead of the textarea, displaying all your styles.
来源：https://stackoverflow.com/questions/9274120/how-can-i-display-bold-text-in-a-textarea