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

Question

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

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

基本上我想做的是将

<b>

标签转换为粗体并将

<br>

标签转换为新行。

我想不使用任何编辑器来做。

Answer 1

如果只想显示 HTML 输出，请使用

div

标签代替

textarea

。因为，我们无法在

textarea

.

中显示渲染的 HTML

如果您想显示 HTML 输出并希望其可编辑，请在

contenteditable

标签上使用

div

属性。

有关

contenteditable

的更多信息，请访问

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

Answer 2

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

更多参考here（已经在stackoverflow上询问过）

Answer 3

为此，您应该使用基于 javascript 的WYSIWYG HTML 编辑器，如tinymce 和CKEditor。

否则 HTML 代码将保持原样（纯文本）。

但是如果你使用编辑器，用户将能够编辑内容，内容将使用 javascript 转换为富文本（这正是编辑器会神奇地为你做的）。

所见即所得 = 所见即所得

Answer 4

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

<?  
   $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>

Answer 5

正如其他人所解释的那样。我有一些解决方案，例如下面的代码。实际上我创建了一个 div 然后我将它转换为 textarea 然后我的 php 代码。

它对我有用，请立即尝试。我想你得到了答案。

<div style="height: 100px;overflow-y: scroll;text-rendering:auto;overflow: auto;resize: vertical;">
    
    <?php
    //this is my chat.
       $text = " Rohit | 14-04-2023 12:32:31 
                 <b>nilesh bhai </b> 
     
                Rohit  | 13-04-2023 19:17:17 
                <b>this is correct</b> ";
     
         echo nl2br($text); 
        // answer is
         //  M3 Insurance | 14-04-2023 12:32:31
         //  **nilesh bhai**
    
        //   M3 Insurance | 13-04-2023 19:17:17
         //  **this is correct**
    ?>
    
  </div>