正确显示textarea中输入的回车和空格 - CSDN博客
正确显示textarea中输入的回车和空格
在textarea中输入的文本。如果含有回车或空格。在界面上显示的时候则不哪么正常。回车消失了，空格变短了。
如何解决这个问题呢。有2种方法。
1.使用&pre&标签
&& w3c对pre元素是这样定义的：pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
&& 更详细的内容请参考&
&& 也就是说包含在pre标签中的回车和空格会正常的显示出来。包括你在页面代码中输入的。所以如果使用pre元素你需要这样写：
&pre&要输出的文本&/pre&
&& ，而不是这样：
&&&&&&要输出的文本
&& 后一种写法 文本前的空白也会被显示的。除非你真的希望这样:)
2.对文本内容进行替换。
& 回车和空格不能正确显示，究其原因是他们各自的表示方式不同。在textarea里面输入的回车是字符&\r&，html中的回车(换行)是&&br/&&。
& textarea中输入的空格是空白& &，而html中的一个空格是&&&。理所当然不能正确显示。好了现在知道了原因就有了第二种解决方案了。
& 只要我们将输入的文本中相应的&元素&替换成html认识的就ok了。因此下面一行代码即可解决问题：
&要输出的文本&.replaceAll(&&&,&&&).replaceAll(&\r&,&&br/&&);
& 等等。这里还有一点小问题。把一个空格替换成一个&&&空格看上去仍然要少些。如果你喜欢可以替换成2个。
& 最后，除了回车和空格以外还有很多空白字符如tab等，如果你喜欢可以一并处理了^_^
& 最后的最后，如果本来的文本是很长的一行，使用pre标签后就不会自动换行。结果页面出现横向滚动条。
文本过长时，溢出
如果我们在pre里放置的文本过长，中间也没有换行，由于pre会保持文本的格式，导致文本溢出。
演示如下：
style=&width:500
background: padding:20&&
&pre&[ti:凡人歌][ar:李宗盛][al:凡人歌][00:00](music)[00:28]你我皆凡人，生在人世间；[00:35]终日奔波苦，一刻不得闲；[00:43]既然不是仙，难免有杂念；[00:50]&a
href=&#&&道义放两旁&/a&，利字摆中间。&/pre&
浏览器中的表现
解决方法1：给pre标签定义横向滚动条
&&overflow:
解决方法2：使用text-wrapping
直接定义pre标签里的css属性white-space的值为pre-wrap。
&&&white-space:pre-
& 而将第二种方法处理过的文本放在&p&标签中显示，就可以显示正常。
第一次发现JavaScript中replace()&方法如果直接用str.replace(&-&,&!&)&只会替换第一个匹配的字符.&
而str.replace(/\-/g,&!&)则可以全部替换掉匹配的字符(g为全局标志)。&
本文已收录于以下专栏：
相关文章推荐
在textarea中输入的文本。如果含有回车或空格。在界面上显示的时候则不哪么正常。回车消失了，空格变短了。
如何解决这个问题呢。有2种方法。
1.使用标签
w3c对pre元素是这样定义的...
在textarea中输入的文本。如果含有回车或空格。在界面上显示的时候则不哪么正常。回车消失了，空格变短了。
如何解决这个问题呢。有2种方法。
1.使用标签
w3c对pre元素是这样定义的...
在textarea中输入的文本。如果含有回车或空格。在界面上显示的时候则不哪么正常。回车消失了，空格变短了。
如何解决这个问题呢。有2种方法。
1.使用标签
w3c对pre元素是这样定义的...
目的：为了保持提交表单前输入框内的内容格式和用户在看到自己的数据之后保持一致
test.html:
textarea测试
.cc{width:600px...
我们要实现这个样一个功能：
输入一个整数 n ，表示接下来要输入 n行字串，每一行字串带有空格。按回车表示结束改行的输入。...
C语言，以空格为分割，以回车为结束标记，输入一串数字到一个int数组中
scanf()函数接收输入数据时，遇以下情况结束一个数据的输入：（不是结束该scanf函数，scanf函数仅在每一个数据域均有数据，并按回车后结束）。
① 遇空格、“回车”、“跳格...
在textarea中输入回车符 在js读取textarea中的值有\r\n然后到业务层转换到string中就有可能变成空格形式然后被存入数据库，当在取出此值的时候则会变成空格的形式,因此我们需要将不显...
在MathType中我们不是为了公式之间排版的需要还是公式编辑的需要，我们都需要通过空格来完成上述内容的要求！通过正确的输入空格能让公式整体都显的清清楚楚，因此该如何在MathType中正确的输入空格...
他的最新文章
讲师：何宇健
讲师：董岩
您举报文章：
举报原因：
原文地址：
原因补充：
(最多只允许输入30个字)3388人阅读
TEXTAREA显示（4）
在textarea中输入的文本。如果含有回车或空格。在界面上显示的时候则不哪么正常。回车消失了，空格变短了。
如何解决这个问题呢。有2种方法。
1.使用&pre&标签
&& w3c对pre元素是这样定义的：pre 元素可定义预格式化的文本。被包围在 pre 元素中的文本通常会保留空格和换行符。而文本也会呈现为等宽字体。
&& 更详细的内容请参考&
&& 也就是说包含在pre标签中的回车和空格会正常的显示出来。包括你在页面代码中输入的。所以如果使用pre元素你需要这样写：
&pre&要输出的文本&/pre&
&& ，而不是这样：
&&&&&&要输出的文本
&& 后一种写法 文本前的空白也会被显示的。除非你真的希望这样:)
2.对文本内容进行替换。
& 回车和空格不能正确显示，究其原因是他们各自的表示方式不同。在textarea里面输入的回车是字符&\r&，html中的回车(换行)是&&br/&&。
& textarea中输入的空格是空白& &，而html中的一个空格是&&&。理所当然不能正确显示。好了现在知道了原因就有了第二种解决方案了。
& 只要我们将输入的文本中相应的&元素&替换成html认识的就ok了。因此下面一行代码即可解决问题：
&要输出的文本&.replaceAll(&&&,&&&).replaceAll(&\r&,&&br/&&);
& 等等。这里还有一点小问题。把一个空格替换成一个&&&空格看上去仍然要少些。如果你喜欢可以替换成2个。
& 最后，除了回车和空格以外还有很多空白字符如tab等，如果你喜欢可以一并处理了^_^
& 最后的最后，如果本来的文本是很长的一行，使用pre标签后就不会自动换行。结果页面出现横向滚动条。不知道有没有好的解决方法？
& 而将第二种方法处理过的文本放在&p&标签中显示，就可以显示正常。
第一次发现JavaScript中replace()&方法如果直接用str.replace(&-&,&!&)&只会替换第一个匹配的字符.&
而str.replace(/\-/g,&!&)则可以全部替换掉匹配的字符(g为全局标志)。&
&&相关文章推荐
* 以上用户言论只代表其个人观点，不代表CSDN网站的观点或立场
访问：8030395次
积分：68629
积分：68629
排名：第28名
原创：256篇
转载：2737篇
评论：726条
(7)(35)(73)(46)(92)(17)(25)(37)(63)(7)(74)(67)(95)(177)(113)(86)(40)(43)(71)(14)(10)(17)(12)(6)(20)(27)(54)(71)(97)(74)(32)(2)(24)(21)(62)(60)(36)(23)(27)(46)(34)(76)(63)(121)(141)(74)(54)(120)(77)(42)(4)(12)(19)(1)(9)(15)(19)(18)(16)(31)(79)(68)
(window.slotbydup = window.slotbydup || []).push({
id: '4740887',
container: s,
size: '250,250',
display: 'inlay-fix'博客访问： 403129
博文数量： 141
博客积分： 6011
博客等级： 准将
技术积分： 1490
注册时间：
IT168企业级官微
微信号：IT168qiye
系统架构师大会
微信号：SACC2013
关于在textarea中输入回车换行和空格字符的正常显示
在表单页中含有textarea控件，如果输入内容有回车换行的动作，字符串存储到数据库中后，再提取出来显示的话就会发现回车换行动作的地方让一个空格给代替了，另外几个空格的位置也只变成一个空格，没有保持原想的格式，下面这段代码就可以解决这个问题。
&%!public String turn(String str){//下面的代码将字符串以正确方式显示（包括回车，换行，空格）while(str.indexOf("\n")!=-1){ str = str.substring(0,str.indexOf("\n"))+"&br&"+str.substring(str.indexOf("\n")+1);} while(str.indexOf(" ")!=-1){ str = str.substring(0,str.indexOf(" "))+"&"+str.substring(str.indexOf(" ")+1); } }%&&%=turn(rs.getString("content"))%&//输出 /**str.indexOf("\n") 返回str中\n（换行）的位置；& *str.subString(0,str.indexOf("\n")):返回给定区间的字符串& */(int&beginIndex) &&&&&&&&&&Returns a new string that is a substring of this string.
阅读(1614) | 评论(0) | 转发(0) |
相关热门文章
给主人留下些什么吧！~~
请登录后评论。安全检查中...
请打开浏览器的javascript，然后刷新浏览器
< 浏览器安全检查中...
还剩 5 秒&之前在做页面的时候经常发现写的textarea中会有一些默认的空格出现，鼠标可以在里面任意点击。这个问题折腾了好久，后来发现，原来是&textarea&&/textarea&标签没有写在同一行所致。。。写的时候想代码美观点所以写成了如下形式
1 &textarea name="search"&2
{$vo.name}3 &/textarea&
但是发现这样会产生好多空格，改成这种形式就好
1 &textarea name="search"&{vo.name}&/textarea&
阅读(...) 评论()