存储到数据库中的文章,为什么取出来之后就没有换行、空格了?

31 篇文章 0 订阅
3 篇文章 0 订阅
在taxtarea中输入的文本。如果含有回车或空格。在界面上显示的时候则不哪么正常。回车消失了,空格变短了。
如何解决这个问题呢。有2种方法。
1.使用<pre>标签
   w3c对pre元素是这样定义的:pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
   更详细的内容请参考 http://www.w3school.com.cn/tags/tag_pre.asp
   也就是说包含在pre标签中的回车和空格会正常的显示出来。包括你在页面代码中输入的。所以如果使用pre元素你需要这样写:
  
<pre>要输出的文本</pre>   ,而不是这样:
  
  <pre>
      要输出的文本
  </pre>   后一种写法 文本前的空白也会被显示的。除非你真的希望这样:)
2.对文本内容进行替换。
  回车和空格不能正确显示,究其原因是他们各自的表示方式不同。在textarea里面输入的回车是字符"\r",html中的回车(换行)是"<br/>"。
  textarea中输入的空格是空白" ",而html中的一个空格是"&nbsp;"。理所当然不能正确显示。好了现在知道了原因就有了第二种解决方案了。
  只要我们将输入的文本中相应的"元素"替换成html认识的就ok了。因此下面一行代码即可解决问题:
 
"要输出的文本".replaceAll(" ","&nbsp;").replaceAll("\r","<br/>");  等等。这里还有一点小问题。把一个空格替换成一个"&nbsp;"空格看上去仍然要少些。如果你喜欢可以替换成2个。
 
  最后,除了回车和空格以外还有很多空白字符如tab等,如果你喜欢可以一并处理了^_^
 
  最后的最后,如果本来的文本是很长的一行,使用pre标签后就不会自动换行。结果页面出现横向滚动条。不知道有没有好的解决方法?
  而将第二种方法处理过的文本放在<p>标签中显示,就可以显示正常。
数据库存储换行空格、字号、颜色、下划线和加粗等格式的文本,可以使用HTML标签或者富文本格式进行存储。 对于换行空格,可以使用HTML标签的<br>标签表示换行,使用 表示空格。 对于字号和颜色,可以使用HTML标签的<font>标签设置字号和颜色属性。 对于下划线和加粗,可以使用HTML标签的<u>和<b>标签进行设置。 例如,如果要存储一个带有换行空格、字号、颜色、下划线和加粗的文本,可以使用以下HTML代码进行存储: ```html <p>这是一个带有换行空格的文本。<br>这是第二行。</p> <p><font size="4" color="red">这是一个带有字号和颜色的文本。</font></p> <p><u>这是一个带有下划线的文本。</u></p> <p><b>这是一个带有加粗的文本。</b></p> ``` 这样,你可以将这段HTML代码存储数据库,并在需要显示时,将其解析为HTML格式进行展示。 #### 引用[.reference_title] - *1* [HTML常用标签(标题,段落,换行,加粗,倾斜,删除线,下划线,div,span,图像,路径,6种超链接,特殊...](https://blog.csdn.net/Everything_na/article/details/109853274)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] - *2* *3* [QTextCharFormat:设置文本编辑框字体,字号,加粗,倾斜,下划线,颜色](https://blog.csdn.net/zhengyanan815/article/details/127025459)[target="_blank" data-report-click={"spm":"1018.2226.3001.9630","extra":{"utm_source":"vip_chatgpt_common_search_pc_result","utm_medium":"distribute.pc_search_result.none-task-cask-2~all~insert_cask~default-1-null.142^v91^insertT0,239^v3^insert_chatgpt"}} ] [.reference_item] [ .reference_list ]
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值