关于textarea提交的内容无法换行的解决办法

当我们在页面上通过 textarea 提交数据的时候，我们我们输入的内容在提交后都会被处理为了一段内容，即使我们在 textarea 里面输入了很多的换行，提交后也是一段内容，那如果我们需要将我们输入的信息按照输入的形式保存下来该如何做呢？

这里面存在一个主要的问题是在页面显示的时候换行符是 <br /> 标签，而内容在 textarea 中显示时的换行符是 \n ，下面介绍一种方法通过 js 将输入的内容中的换行符转换为网页中的换行符。在网页数据提交钱作如下处理即可。

代码如下:

<script type="text/javascript">
//回车转换行
var content=document.getElementById("content").value;
content=content.replace('\n','<br />');
document.getElementById("content").value=content;
//然后提交
</script>

在页面中显示的时候同样需要经过一下处理，与以上处理过程正好相反：

代码如下:

content=content.replace('<br />','\n');

下面对 js 的 replace 函数做一下解释：

语法：

stringObject.replace(regexp/substr,replacement)

replace() 方法用于在字符串中用一些字符替换另一些字符，或替换一个与正则表达式匹配的子串。

一、替换单个字符

代码如下:

<script language="javascript">
var str="javascript is a good script language";
alert(str.replace("a","A"));//输出jAvascript is a good script language
</script>

二、替换字符串中存在的指定的所有字符（全部替换）

代码如下:

<script language="javascript">
var str="javascript is a good script language";
alert(str.replace(/a/g,"A"));//输出jAvAscript is A good script lAnguAge
</script>

上述的/g，是正则表达式，这说明，在replace()还可以使用正则表达式。

当然 replace 还有更高级的用法，大家可以相关文档获取更多更多的高级用法。

赞 (0)

相关推荐

  • JS在textarea光标处插入文本的小例子

    下面是代码: 复制代码 代码如下: --------------------------------------------------------------------------------<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html x

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

    步骤: 1. 用<pre><c:out value="<%=从数据库显示的字段%>"></c:out></pre> 2. 显示页面中增加: 复制代码 代码如下: <style type="text/css"> pre { white-space: pre-wrap; white-space: -moz-pre-wrap; white-space: -pre-wrap; white-space:

  • TextArea设置MaxLength属性最大输入值的js代码

    标准的DHTML文档中TEXTAREA的MAXLENGTH属性默认情况下不起作用,只有当事件发生时才起作用 如下:http://spiderscript.net/site/spiderscript/examples/ex_textarea_maxlength.asp 但TEXT中有且起作用<input type="text" maxlength="20">, 那么在TEXTAREA中怎么实现输入内容不能超过多少个字符呢. 方法1.如果只需要截取多少个字符

  • Textarea与懒惰渲染实现代码

    代码如下. 复制代码 代码如下: <div> 立即渲染内容 <ul> <li>张三<img src="p01.jpg"/></li> <li>张四<img src="p02.jpg"/></li> </ul> </div> <div> <textarea id="lazyRender01" style=&quo

  • 关于textarea提交的内容无法换行的解决办法

    当我们在页面上通过 textarea 提交数据的时候,我们我们输入的内容在提交后都会被处理为了一段内容,即使我们在 textarea 里面输入了很多的换行,提交后也是一段内容,那如果我们需要将我们输入的信息按照输入的形式保存下来该如何做呢? 这里面存在一个主要的问题是在页面显示的时候换行符是 <br /> 标签,而内容在 textarea 中显示时的换行符是 \n ,下面介绍一种方法通过 js 将输入的内容中的换行符转换为网页中的换行符.在网页数据提交钱作如下处理即可. 复制代码 代码如下:

  • asp和php下textarea提交大量数据发生丢失的解决方法

    我用textarea提交大量的阿数据 我开始字段类型选的是mediumtext,数据有丢失 后来我改成了longtext,数据依然丢失, 而且发现和mediumtext提交到数据库中的数据量是一样的, 并没有增加.该怎样解决呢? asp下只需要用下面的方法即可 复制代码 代码如下: Sub Content()     Dim i,sContent     ' 取提交过来的数据     ' 据说对大表单的自动处理,要使用循环,否则大于100K的内容将有可能取不到,单个表单项的限制为102399字节

  • AngularJS iframe跨域打开内容时报错误的解决办法

    <iframe id="myFrame" ng-src="{{url}}" width="100%" height="100%" seamless frameborder="0" ></iframe> 打开不同域的内容时报下面的错误: Blocked loading resource from url not allowed by $sceDelegate policy 解决方案:

  • SQL Server2005打开数据表中的XML内容时报错的解决办法

    SQL Server2005打开数据表中的XML内容时报错的解决办法

    从SQL Server2005开始提供了一种新的数据类型XML type,它允许用户将数据以XML文件的格式直接存储到数据表中.结合在ASP.NET中使用Linq to Sql,我们可以非常方便地将XML文件存储到SQL Server数据库中.但是在默认情况下,如果你存储的XML文件比较大(超过2MB),在SQL Server管理器中不能直接点击查看XML内容而报以下错误提示: 如何解决该问题呢?很简单,其实错误提示中已经描述地很清楚了,在SQL Server Management Studio

  • jsp实现textarea中的文字保存换行空格存到数据库的方法

    UploadNews.jsp <%@ page language="java" contentType="text/html; charset=utf-8" pageEncoding="utf-8"%> <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dt

  • Javascript 文本框textarea高度随内容自适应增长收缩

    直接上代码: 方案一: 枫芸志 » 文本框textarea高度自适应增长/伸缩 textarea { height:100px; width: 300px; } 晴枫制作 http://jb51.net // 最小高度 var minHeight = 100; // 最大高度,超过则出现滚动条 var maxHeight = 300; function ResizeTextarea(){ var t = document.getElementById('txtContent'); h = t.s

  • ASP.NET GridView中文本内容无法换行(自动换行/正常换行)

    ASP.NET GridView中文本内容无法换行(自动换行/正常换行)

    最近做项目的时候,遇到这样一个问题:我用GridView来显示课程表,每个单元格的内容包括课程名.上课地点.教师姓名,然后我想让它们分行显示,效果如下图: 可是呢,GridView太顽强了,不管我拼接字符串时用"\r\n"还是"<br/>",结果都无济于事,都不分行显示.经过近半天的时间查询资料,最终终于解决了这个问题,下面就与大家分享一下. GridView中的换行问题可以分为两类:一类是自动换行,另一类是正常换行. 先说第一类:自动换行 GridVi

  • PHP实现将textarea的值根据回车换行拆分至数组

    本文实例讲述了PHP实现将textarea的值根据回车换行拆分至数组的方法.分享给大家供大家参考.具体分析如下: textarea回车换行为 \r\n $keyword_list = trim($_REQUEST['keywords']); $keyword_arr = explode("\r\n", $keyword_list); 这个地方需要注意是要去除textarea 前后的空格,否则会多出一个 或者使用explode也是可以的 只是不能用\r\n只能用双引号,不能用单引号 希望

  • 表单提交错误后返回内容消失问题的解决方法（PHP网站）

    表单提交错误后返回内容消失怎么办呐,今天就来分析解决一下这个问题. 状况概述: 做填写表单信息提交的时候会碰到一个问题就是当用户填写并提交表单后,程序判断不符合要求并返回,返回之后之前填写的表单信息会被清空了的情况.如果填写的信息量少还无所谓,如果填写的信息量比较多,这会直接打击到填写信息的人的良好心情.因此解决表单提交错误返回后填写的内容消失的问题是一个提高用户体验度的迫在眉睫的问题. 对于这种问题,综合总结了大概有下面几种情况: (1)页面使用了session_start函数,这个函数有个特

  • html小技巧之td,div标签里内容不换行

    在一些页面开发中,除自己操作外,引起换行的情况一般有: Ex一.td标签里内容长度过长引起换行: Ex二.div标签(或其他标记)里内容有文本和图片引起换行: 解决方法: 针对例子一用<nobr></nobr>标签把换行的内容全部包起来,可以解决问题: 针对例子二用CSS样式white-space: nowrap;可以使图片和内容不换行,(经自己测试使用<nobr></nobr>标签也可以).

随机推荐