javascript 将textarea中的html标签转换为富文本

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/17785845/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-10-27 09:37:34  来源:igfitidea点击:

Convert html tag in textarea to rich text

phpjavascripthtmltextarea

提问by SmartDev

I am using PHP to fill a textarea:

我正在使用 PHP 来填充文本区域:

<textarea text-input" id="Desc" rows="15" wrap="soft" name="Desc"><?php echo $Desc; ?></textarea> 

but the textarea is showing HTML tags in it, which I don't want.

但是 textarea 在其中显示了 HTML 标签,这是我不想要的。

<b>Analog And Digital System</b><br />
<b>Analog System:</b><br />
A string tied to a doorknob would be an analog system. They have a value that changes steadily over time and can have any one of an infinite set of values in a range. If you put a measuring stick or ruler at a specific point along the string, you can measure the string's value every so many seconds at that point. When you watch it move, you will see it moves constantly. It doesn't instantly jump up and down the ruler. <br />
<br />
<b>Digital System:</b><br />
A digital system would be to flick the light switch on and off. There's no 'in between' values, unlike our string. If the switch you are using is not a dimmer switch, then the light is either on, or off. In this case, the transmitter is the light bulb, the media is the air, and the receiver is your eye. This would be a digital system.<br />

Basically what I want to do is convert <b>tags to make the content bold and <br>tags to new lines.

基本上我想做的是转换<b>标签以使内容加粗并将<br>标签转换为新行。

I want to do it without using any editor.

我想在不使用任何编辑器的情况下做到这一点。

采纳答案by Vinod Louis

There is no way to to do HTML formatting inside textarea you will have to use ant editor, but if you want to show it in div then setting the attribute contentEditable="true" will do the trick

没有办法在 textarea 内进行 HTML 格式设置,你将不得不使用 ant 编辑器,但如果你想在 div 中显示它,那么设置属性 contentEditable="true" 就可以了

more references here(already asked on stackoverflow)

这里有更多参考(已经在stackoverflow上询问过)

回答by Sasidhar Vanga

If you want to show only the HTML output, then use a divtag instead of textarea. Because, we cannot show Rendered HTML inside a textarea.

如果您只想显示 HTML 输出,请使用div标签而不是textarea. 因为,我们不能在textarea.

If you want to show HTML output and want that editable, use contenteditableattribute on divtag.

如果要显示 HTML 输出并希望该输出可编辑,请使用标签上的contenteditable属性div

More about contenteditableand it's support can be found at

有关更多信息contenteditable及其支持,请访问

https://developer.mozilla.org/en-US/docs/Web/HTML/Content_Editable

https://developer.mozilla.org/en-US/docs/Web/HTML/Content_Editable

回答by Mohammad Naji

You should use javascript based WYSIWYGHTML Editors like tinymceand CKEditorfor this purpose.

为此,您应该使用基于 JavaScript 的WYSIWYGHTML 编辑器,例如tinymceCKEditor

Otherwise the HTML code will remain as they are (plain text).

否则 HTML 代码将保持原样(纯文本)。

But if you use the editors, the user will be able to edit the content and the content will be converted to rich text using javascript (and it's exactly what the editors will do for you magically).

但是,如果您使用编辑器,用户将能够编辑内容,并且内容将使用 javascript 转换为富文本(而这正是编辑器会神奇地为您做的事情)。

WYSIWYG= What You See Is What You Get

WYSIWYG=所见即所得

回答by tcgumus

You should use the code in here Converting <br /> into a new line for use in a text area

您应该使用此处的代码将 <br /> 转换为新行以在文本区域中使用

<?  
   $text = "Hello <br /> Hello again <br> Hello again again <br/> Goodbye <BR>";
   $breaks = array("<br />","<br>","<br/>");  
   $text = str_ireplace($breaks, "\r\n", $text);  
?>  
<textarea><? echo $text; ?></textarea>