Question

如果我有这样的textarea块......

<textarea name="myTextArea" cols="100" rows="20" readonly=readonly>
.. text area content ...
</textarea>

如何在此文本块中嵌入HTML格式的文本？如果我可以认为以下应该有效......

<textarea name="myTextArea" cols="100" rows="20" readonly=readonly>
<b>Hello how are you today?</b>
</textarea>

举个例子。但那句话并没有显示为粗体。也许我只是想做一些无法做到的事情？

Answer 1

我很确定答案是否定的 - 不能用textarea来做。

来自MDN docs：

HTML＆lt; textarea＆gt; element表示多行纯文本编辑控件。


允许的内容文字

Answer 2

您需要改为使用WYSIWYG编辑器。

Here's一个伟大的人。

Answer 3

无法使用

<textarea>

使用此：

<div contenteditable="true">
</div>

Answer 4

你是对的，无法做到。

According to MDN，＆＃34; character data＆＃34;是<textarea>唯一允许的内容。

正如其他答案所描述的那样，您所寻找的是所见即所得编辑器，如CKEditor，TinyMCE或剑道Editor。

这不是重点，但有趣的是，MDN在其HTMLTextAreaElement页面上列出了一些示例，其中列出了<textarea>中enable dynamic adding of HTML tags以及如何enable autogrow behavior <textarea>。

Answer 5

你可以这样做（转换“特殊”字符）：

<textarea name="myTextArea" cols="100" rows="20" readonly=readonly>
&lt;b&gt;Hello how are you today?&lt;/b&gt;
</textarea>

Answer 6

都能跟得上！如果您在HTML文档中验证了这一点，则会出现

的错误

文档类型不允许元素“b”在这里

你可能正在寻找的是一个你所见即所得的编辑器，它实际上是一个<iframe>，它正在利用JavaScript功能designMode。有可能找到tutorials on how to create these（archive），但使用现有的更好，因为它真的很有用，可用也需要很多工作。

请注意 - 如果您仍然对验证感兴趣，那么如果您使用的是HTML，那么您将无法使用严格的DOCTYPE声明作为WYSIWYG编辑器将使用iframe。

Answer 7

你可以尝试这个也很简单，如果你使用的是asp.net，请在文本区域使用lable contron将其添加为

Text="&lt; stonename &gt;" 
"&lt";stonename"&gt";

Answer 8

你不能在textarea中做到这一点，但你可以做什么......你可以使用p标签和解析信息来标记JQuery。像这样：

    var stringviewinfo ="aaaaaaaaaaaaaaaaaa<br>aaaaaaaaaaaaaaaaaaaaaaaaa<br>aaaaaaaaaaaaaaaa<b>aaaaaaaa</b>aaaaaaaaaaaaaaaaaa<br>aaaaaaaaaaa<font color=\"red\">AAAA</font>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa<b>aaaaaaaaaaaaa<b>aaaaaaaaaaaaaaaaaaaaaaaaaaaa<br>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</br>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa";      
$('#viewinfo').html(stringviewinfo);
<p style="word-wrap: break-word;" id="viewinfo"></p>

我希望这会有所帮助。

Answer 9

到现在（8年后），您知道textarea并非可行之路。如果您碰巧正在使用Vue.js，则可以将div与v-html一起使用以设置内部HTML

<template>
    <div name="myTextArea" cols="100" rows="20" readonly=readonly v-html="content" />
</template>

<script>
    export default {
        data() {
            return{
                content = "<b>Hello how are you today?</b>";
            }
    }
</script>

Answer 10

这是答案。

使用此功能。

function br2nl(varTest) {
        return varTest.replace(/<br\s*\/?>/ig, "\r");
    }

Answer 11

有一个非常简单的方法可以实现。

首先：自定义<textarea>以接受特殊字符并将其保存到数据库

<textarea contenteditable="true" class="form-control" name="setting[header_code]"><?php echo set_value('setting[header_code]', html_entity_decode($item->header_code)) ?></textarea>

第二步：从数据库中提取并回显保存的数据

<?php echo html_entity_decode(config(nl2br('header_code')));?>

希望它可以为您提供帮助。

谢谢

我可以在<textarea>标签中嵌入HTML格式吗？</textarea>

11 个答案: