在HTML中呈现字符串并保留空格和换行符

我有一个MVC3应用程序，有一个详细信息页面。作为其中的一部分，我有一个描述(从db检索)，其中有空格和新行。当它被渲染时，新的行和空格被html忽略。我想对这些空格和新行进行编码，这样它们就不会被忽略。

你是怎么做到的?

我尝试了HTML。编码，但它最终显示编码(甚至不是在空格和新行上，而是在其他一些特殊字符上)

219513 次浏览
小开

你可能想用&nbsp;(非换行空格)替换所有空格，用<br> (html中的换行符)替换所有新行\n。这应该能达到你想要的结果。

body = body.replace(' ', '&nbsp;').replace('\n', '<br>');

就是那种性质。

小开

你试过使用<pre>标签吗?

 <pre>
    

Text with
    

multipel line breaks embeded between pre tag
    

will work    and
also tabs..will work
    

it will preserve the formatting..
</pre>

小开
最佳答案

只需用white-space: pre-wrap;样式化内容即可。

div {
white-space: pre-wrap;
}
<div>
This is some text   with some extra spacing    and a
few newlines along with some trailing spaces
and five leading spaces thrown in
for                                              good
measure
</div>

小开

正如你在@Developer的回答中提到的，我可能会对用户输入进行html编码。如果您担心XSS，您可能永远不需要用户以原始形式输入，因此不妨转义它(并替换空格和换行符)。

注意，在输入时转义意味着您应该使用@Html。Raw或创建一个MvcHtmlString来呈现特定的输入。

你也可以试试

System.Security.SecurityElement.Escape(userInput)

但我认为它也逃不出空间。在这种情况下，我建议使用。net

System.Security.SecurityElement.Escape(userInput).Replace(" ", "&nbsp;").Replace("\n", "<br>")

用户输入。 如果希望更深入地研究可用性，也许可以对用户的输入进行XML解析(或者使用正则表达式)，以只允许预定义的一组标记。 例如，允许

<p>, <span>, <strong>

．.． 但是不要允许

<script> or <iframe>
小开

我正在尝试由pete陈述的white-space: pre-wrap;技术，但如果字符串是连续的，很长，它只是运行出容器，并没有翘曲出于任何原因，没有太多时间去调查..但如果你也有同样的问题，我最终使用<pre>标签和下面的css，一切都很好。

pre {
font-size: inherit;
color: inherit;
border: initial;
padding: initial;
font-family: inherit;
}
小开

可以使用空白:pre-line在格式化中保留换行符。不需要手动插入html元素。

.popover {
white-space: pre-line;
}

或添加到你的html元素style="white-space: pre-line;"

小开

有一个简单的方法。我在我的应用程序上试了试，效果很好。

只要输入:$text = $row["text"]; 回声nl2br(文本)美元;< / p >


提交答案