欢迎来到DIVCSS5查找CSS资料与学习DIV CSS布局技术!
  htmltextarea定义和用法:
 
  <textarea>标签定义多行的文本输入控件。
 
  文本区中可容纳无限数量的文本,其中的文本的默认字体是等宽字体(通常是Courier)。
 
  可以通过cols和rows属性来规定textarea的尺寸,不过更好的办法是使用CSS的height和width属性。
 
  注释:在文本输入区内的文本行间,用"%OD%OA"(回车/换行)进行分隔。
 
  提示:可以通过<textarea>标签的wrap属性设置文本输入区内的换行模式。
 
  HTML<textarea>标签实例:
 
  <textarearows="3"cols="20">
 
  在php中文网,你可以找到你所需要的所有的网站建设教程。
 
  </textarea>
 
  htmltextarea的属性:
 
  tuyi.png
 
  HTML中的标签textarea的属性及用法:
 
  1.cols,垂直列。在没有做样式表设置的情况下,它表示一行中可容纳下的字节数。例如cols=60,表示一行中最多可容纳60个字节,也就是30个汉字。另外要注意的是,文本框的宽度就是通过这个来调整,输入好cols的数值,然后再定义输入文字字体的大小(不定义的话,会采用默认值),那么文本框的宽度就确定了。
 
  2.rows,水平列。表示可显示的行数,例如rows=10,表示可显示10行。超过10行,则需要拖动滚动条来浏览了。
 
  3.name,文本框的名称,这项必不可省,因为存储文本的时候必须用到。
 
  4.warp,当warp="off"表示该文本区域中不自动换行,当然不写默认是自动换行的。这个参数一般用得比较少。
 
  5.style,这是个非常实用的参数,可以用来设置文本框的背景色,滚动条颜色及形式,边框色,输入字体的大小颜色等等。
 
  6.class,一般用来调用外部css里边的设置。
 
  获取textarea标签中的换行符和空格:
 
  问题:获取到textarea标签内的格式(换行符、空格)取到,存入数据库,展示的时候能够保留基本格式。
 
  解决思路:
 
  IE9以上、FF、chrome的换行为\n,IE7-8的时候换行为\r\n,空格都为\s
 
  所以需要利用replace把不同浏览器的\n和\r\n都替换为html代码的</br>,把\s空格替换为html的&nbsp
 
  注:如果使用jQuery的val()获取textarea的值,取得的值是不含有回车(\r)字符的。但是如果该值是通过XHR传递给服务器的,回车(\r)字符会被保留(或者是被浏览器添加的,但是在原始数据中并不包含回车(\r))。
 
  该例对\r和\r\n都做了replace替换,实际效果不受影响,只需要注意一下有区别。
 
  代码如下:
 
  html:
 
  <textareaname=""id="text"cols="30"rows="3"></textarea>
 
  <inputtype="button"id="btn"value="测试测试"/>
 
  <divid="show"></div>
 
  js:
 
  document.getElementById("btn").onclick=function(){
 
  varstrContent=document.getElementById("text").value;
 
  alert("处理前的strContent为\r\n"+strContent);
 
  strContent=strContent.replace(/\r\n/g,'<br/>');//IE9、FF、chrome
 
  strContent=strContent.replace(/\n/g,'<br/>');//IE7-8
 
  strContent=strContent.replace(/\s/g,'');//空格处理
 
  alert("转换之后的html代码为\r\n"+strContent);
 
  document.getElementById("show").innerHTML=strContent;
 
  };





本文转载自中文网
 

如需转载,请注明文章出处和来源网址:http://www.divcss5.com/html5/h54850.shtml