textarea正确显示空格换行以及空格,回车问题解决

前两天做了一个意见收集表单,测试提出问题如下:

1.空格回车不能正确显示;(回车消失,空格变短)
2.建议为空也能提交;

首先解决空格回车不能正确显示的问题,不同浏览器下textarea的回车符不一致:
IE浏览器:'\r\n';
FF浏览器,chrome浏览器:'\n';
空格符不同浏览器下都为:'\s';

但是在html中,换行符为 '
'; 空格符为 ' '
因此我们需要将textarea中的 '\r\n' , '\n' , '\s' 进行替换:

 var getFormatCode = function(strValue){
        return strValue.replace(/\r\n/g, '
').replace(/\n/g, '
').replace(/\s/g, '  '); } var adviceText = getFormatCode($('#advice').val()); //将值进行替换

其次解决建议为空也能提交的问题,本来我以为我对意见为空的情况作了判断:

if (adviceText ==="" || adviceText===null){
            alert("建议需求不能为空")
        }

实际上这样对输入空格判断无效,需要用正则表达式来判断:

var input  = /^[\s]*$/;    //判断空格
var getFormatCode = function(strValue){
        return strValue.replace(/\r\n/g, '').replace(/\n/g, '').replace(/\s/g, '');            //将换行空格都转换为html中的空格
    }
var adviceText = getFormatCode($('#advice').val());
input.test(adviceText)   //如若全为空格,值为true;

附上手机号码以及电子邮箱的正则表达式:

var phone =  /^1\d{10}$/;  //首数字为1,总长度为11位;test值为true表示格式正确;
var email = /^(\w-*\.*)+@(\w-?)+(\.\w{2,})+$/;

你可能感兴趣的:(textarea正确显示空格换行以及空格,回车问题解决)