`
iwenhui
  • 浏览: 4442 次
社区版块
存档分类
最新评论

TextArea文本样式原样输出

阅读更多

      在开发中经常会遇到:包含多行文本框的表单提交后,与输出页面中看到的是乱糟糟的,没有按照原本提交的文章样式来显示。如何如何让文本该换行就行,该缩进就缩进呢。与此提供一种小方法,无需通过代码对标签进行转义的简单便捷方法。

       1.使用<pre>标签将内容包起来:入<pre>${replyContent}</pre>

       2.添加样式,支持各浏览器:

  <style type="text/css">
        pre{
           white-space: pre-wrap;      
           white-space: -moz-pre-wrap; 
           white-space: -pre-wrap;     
           white-space: -o-pre-wrap;   
           word-wrap: break-word;      
        }
   </style>

       3.完事

分享到:
评论

相关推荐

    从textarea中获取数据之后按原样显示实现代码

    当用户提交这些数据后,我们可能需要按照用户输入的原样进行显示,特别是在需要展示代码或者保留文本格式的场景中。以下是实现这一功能的相关知识点和代码示例。 知识点解析: 1. `&lt;textarea&gt;`标签:这是一个HTML...

    jQuery中Form相关知识汇总

    相反,当元素失去焦点时,`.blur()`事件被触发,`.removeClass('focus')`移除该样式,使元素恢复原样。 具体代码如下: ```javascript $(function () { $(":input").focus(function () { $(this).addClass(...

    jQuery文本框得到与失去焦点动态改变样式效果

    7. 实际运行效果的描述:虽然没有提供实际的运行效果图,但可以想象,当用户点击这些表单控件时,它们会获得或失去焦点,根据上述的jQuery和CSS代码,获得焦点的控件会改变样式,失去焦点时则恢复原样。 最后,文档...

    vue学习笔记1

    需要注意的是,如果数据中包含HTML标签,`v-text`会原样输出,而不会进行HTML解析。另一方面,`v-html`指令则会将文本内容作为HTML片段解析并插入,这可能导致XSS(跨站脚本攻击)风险,因此应当谨慎使用。 Vue的另...

    html标签学习

    21. `&lt;textarea&gt;`:多行文本输入框。 22. `&lt;select&gt;`:下拉选择列表,通过`&lt;option&gt;`定义选项。 23. `&lt;table&gt;`、`&lt;tr&gt;`、`&lt;td&gt;`和`&lt;th&gt;`:创建表格,`&lt;tr&gt;`为行,`&lt;td&gt;`为数据单元格,`&lt;th&gt;`为表头单元格。 这些...

    jsp文本框小技巧、特效

    &lt;textarea name="content" rows="6" cols="80" onpropertychange="if (this.scrollHeight &gt; 80) this.style.posHeight = this.scrollHeight + 5"&gt;...&lt;/textarea&gt; ``` **解析:** - `onpropertychange`事件监听文本...

    HTML笔记1(2024.3.14)第一篇博客

    - **原样输出标签**:`&lt;pre&gt;`,保持原有格式输出文本。 - **示例**: ```html 这里会保持原有的换行和空格。 ``` - **行内标签**:`&lt;span&gt;`,用于包裹文本,不单独占用空间。 - **示例**: ```html ;"&gt;这...

    HTML标记大全.doc

    - **备注**:已被废弃,在现代HTML中推荐使用CSS来设置文本样式。 **9. `&lt;BIG&gt;`** - **类型**:字体加大 - **名称或意义**:增大字体大小。 - **作用**:使文本稍微变大。 - **备注**:已不推荐使用,应使用CSS来...

    xheditor-1.1.14

    参数1:要粘贴的文本,例:'这里的内容完全原样显示&lt;strong&gt;aaa&lt;/strong&gt;' 参数2:是否覆盖粘贴,留空(覆盖粘贴)、true(粘贴在光标选择区域之前)、false(粘贴在光标选择区域之后) formatXHTML:格式化XHTML代码 参数...

    html标签全称和功能介绍

    HTML5中,更推荐使用CSS来设置文本样式。STF。 10. `&lt;base&gt;`:定义页面中所有链接的默认地址或默认目标。这会影响页面上的相对URL。STF。 11. `&lt;basefont&gt;`:不推荐使用。HTML5中,应使用CSS来设置文本的字体、...

    blog-website

    9. 表单元素:如果博客允许用户互动,如评论功能,将涉及`&lt;form&gt;`、`&lt;input&gt;`、`&lt;textarea&gt;`等表单元素,以及`&lt;button&gt;`提交按钮。 10. JavaScript交互:虽然不是HTML本身的功能,但JavaScript通常与HTML一起使用,...

Global site tag (gtag.js) - Google Analytics