JS如何获取用户输入的回车、空格等特殊字符？

时间：2022-12-19 17:04:41
做一个站内信的功能，发件人发信时是什么格式，那么收件人收信也是那样的格式

内容是一个textarea标签，id为mailContent，代码全写在一个.js文件里

如果用户输入内容如下：
=========================
你好：
  很高兴认识你。

=========================

那么我document.getElementById("mailContent").innerText后，得到的应该是这样一段字符串：

你好：</br>&nbsp;&nbsp;很高兴认识你。</br>

我给这个textarea加了一个onkeyup事件，每次调用都掉testPress方法，代码如下 



mail.prototype.testPress = function(event){

         var str = document.getElementById("mailContent").innerText;

	event = event || window.event;

	if(event.keyCode == 13){

		this.content = str + '</br>';

	}else{


		this.content =  str;

	}

}


但是这样写的话，最后this.content的值为 ：你好：很高兴认识你。</br>

因为最后一个按下的是回车键，所以才会加上，前面虽然按下了，但是var str = document.getElementById("mailContent").innerText; 时，没有拿到回车，只获取到文本了，所以实现不了我想要的功能

是不是用char(10)也可以？ 



var content = document.getElementById("mailContent").innerHTML;

var a = content.replace(/char(10)/,'</br>');


可是这样不行啊~

请问大家有什么好办法？

13 个解决方案

#1

试试用onpropertychange事件看看

#2

不用按一下回车就加换行吧，楼主在最后提交的时候把\r\n替换成<br/>就可以了。

#3


var content = document.getElementById("mailContent").value;
var a = content.replace(/char(10)/,'</br>');

别老以为innerHTML是万能的。

#4

textarea换行是\n 换行符

#5

引用 2 楼 ltnrain 的回复:
不用按一下回车就加换行吧，楼主在最后提交的时候把\r\n替换成 <br/>就可以了。

原来这个意思，LZ想过滤掉回车 


var str = document.getElementById("mailContent").innerText;

str = str.replace("\r\n","<br/>");

str = str.replace(" ","&nbsp;");

alert(str);

#6

引用 1 楼 lihui_shine 的回复:
试试用onpropertychange事件看看


用过，但是输入汉字就不对了

#7



    <textarea id="content" rows="5" cols="20"></textarea>

    <input type="button" value="show" onclick="show()" />

    <div id="div1">

    </div>


    <script type="text/javascript">

        function show() {

            var content = document.getElementById("content").value.replace(/\r\n/g, "<br/>").replace(/\n/g, "<br/>");

            document.getElementById("div1").innerHTML = content;

        }

    </script>

#8

引用 3 楼 cn00439802 的回复:
var content = document.getElementById("mailContent").value;
var a = content.replace(/char(10)/,' </br>');

别老以为innerHTML是万能的。


呵呵，没老以为innerHTML是万能的，value也不行

#9

引用 5 楼 lihui_shine 的回复:
引用 2 楼 ltnrain 的回复:
不用按一下回车就加换行吧，楼主在最后提交的时候把\r\n替换成 <br/>就可以了。

原来这个意思，LZ想过滤掉回车
JScript codevar str= document.getElementById("mailContent").innerText;
str= str.replace("\r\n","<br/>");
str= str.replace("","&nbsp;");
alert(str);


这样做回车不管用的

#10



var content = document.getElementById('mailContent').value;

var str1 = content.replace(/\r\n/g,"</br>");

str1 = content.replace(/ /g,"&nbsp;");

alert(str1);


这么写的话，它只会替换空格，回车不管用 



var content = document.getElementById('mailContent').value;

var str1 = content.replace(/\r\n/g,"</br>");

alert(str1);

var str2 = content.replace(/ /g,"&nbsp;");

alert(str2);


分开写的话就没事了，str1替换回车，str2替换空格

可是写一起怎么就只替换空格呢？？

#11

将特殊字符替换掉

#12

今天刚看到一个键盘记录的例子，不知道对lz有没有帮助。比较菜，直贴源码了 


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD><TITLE>js 按键记录</TITLE>

<META NAME="Generator" CONTENT="EditPlus">

<META NAME="Author" CONTENT="羽殇仁">

<META NAME="Keywords" CONTENT="js 按键记录">

<META NAME="Description" CONTENT="js 按键 记录">

</HEAD>

<BODY>

<script type="text/javascript">

var keystring = "";//记录按键的字符串

function $(s){return document.getElementById(s)?document.getElementById(s):s;}

function keypress(e)

{

　 var currKey=0,CapsLock=0,e=e||event;

　   currKey=e.keyCode||e.which||e.charCode;

　 CapsLock=currKey>=65&&currKey<=90;

　 switch(currKey)

　 {

   　 　 //屏蔽了退格、制表、回车、空格、方向键、删除键

   　 　 case 8: case 9:case 13:case 32:case 37:case 38:case 39:case 40:case 46:keyName = "";break;

   　 　 default:keyName = String.fromCharCode(currKey); break;

　 }

　 keystring += keyName;

}

function keydown(e)

{

　 var e=e||event;

　 var currKey=e.keyCode||e.which||e.charCode;

　 if((currKey>7&&currKey<14)||(currKey>31&&currKey<47))

　 {

　 　   switch(currKey)

   　 　 {

    　 　 　 case 8: keyName = "[退格]"; break;

    　 　 　 case 9: keyName = "[制表]"; break;

    　 　 　 case 13:keyName = "[回车]"; break;

    　 　 　 case 32:keyName = "[空格]"; break;

    　 　 　 case 33:keyName = "[PageUp]";   break;

    　 　 　 case 34:keyName = "[PageDown]";   break;

    　 　 　 case 35:keyName = "[End]";   break;

    　 　 　 case 36:keyName = "[Home]";   break;

    　 　 　 case 37:keyName = "[方向键左]";   break;

    　 　 　 case 38:keyName = "[方向键上]";   break;

    　 　 　 case 39:keyName = "[方向键右]";   break;

   　 　 　   case 40:keyName = "[方向键下]";   break;

    　 　 　 case 46:keyName = "[删除]";   break;

    　 　 　 default:keyName = "";    break;

　 　   }

　 　   keystring += keyName;

　 }

　 $("content").innerHTML=keystring;

}

function keyup(e)

{

　 $("content").innerHTML=keystring;

}

document.onkeypress=keypress;

document.onkeydown =keydown;

document.onkeyup =keyup;


</script>

<input type="text" />

<input type="button" value="清空记录" onclick="$('content').innerHTML = '';keystring = '';"/>

<br/>请按下任意键查看键盘响应键值：<span id="content"></span>


</BODY>

</HTML>

#13

引用 10 楼 sunshine_99 的回复:
JScript codevar content= document.getElementById('mailContent').value;var str1= content.replace(/\r\n/g,"</br>");
str1= content.replace(//g,"&nbsp;");alert(str1);

这么写的话，它只会替换空格，回车不管用

JScript codevar content= document.getElementById('mailContent').value;var str1= content.replace(/\r\n/g,"</br>");
alert(str1);var str2= content.replace(//g,"&nbsp;");alert(str2);

分开写的话就没事了，str1替换回车，str2替换空格

可是写一起怎么就只替换空格呢？？

var  content= document.getElementById('mailContent').value;
content=  content.replace(/\r\n/g,"</br>");
content=  content.replace(//g,"&nbsp;");
alert( content);

#1

试试用onpropertychange事件看看

#2

不用按一下回车就加换行吧，楼主在最后提交的时候把\r\n替换成<br/>就可以了。

#3


var content = document.getElementById("mailContent").value;
var a = content.replace(/char(10)/,'</br>');

别老以为innerHTML是万能的。

#4

textarea换行是\n 换行符

#5

引用 2 楼 ltnrain 的回复:
不用按一下回车就加换行吧，楼主在最后提交的时候把\r\n替换成 <br/>就可以了。

原来这个意思，LZ想过滤掉回车 


var str = document.getElementById("mailContent").innerText;

str = str.replace("\r\n","<br/>");

str = str.replace(" ","&nbsp;");

alert(str);

#6

引用 1 楼 lihui_shine 的回复:
试试用onpropertychange事件看看


用过，但是输入汉字就不对了

#7



    <textarea id="content" rows="5" cols="20"></textarea>

    <input type="button" value="show" onclick="show()" />

    <div id="div1">

    </div>


    <script type="text/javascript">

        function show() {

            var content = document.getElementById("content").value.replace(/\r\n/g, "<br/>").replace(/\n/g, "<br/>");

            document.getElementById("div1").innerHTML = content;

        }

    </script>

#8

引用 3 楼 cn00439802 的回复:
var content = document.getElementById("mailContent").value;
var a = content.replace(/char(10)/,' </br>');

别老以为innerHTML是万能的。


呵呵，没老以为innerHTML是万能的，value也不行

#9

引用 5 楼 lihui_shine 的回复:
引用 2 楼 ltnrain 的回复:
不用按一下回车就加换行吧，楼主在最后提交的时候把\r\n替换成 <br/>就可以了。

原来这个意思，LZ想过滤掉回车
JScript codevar str= document.getElementById("mailContent").innerText;
str= str.replace("\r\n","<br/>");
str= str.replace("","&nbsp;");
alert(str);


这样做回车不管用的

#10



var content = document.getElementById('mailContent').value;

var str1 = content.replace(/\r\n/g,"</br>");

str1 = content.replace(/ /g,"&nbsp;");

alert(str1);


这么写的话，它只会替换空格，回车不管用 



var content = document.getElementById('mailContent').value;

var str1 = content.replace(/\r\n/g,"</br>");

alert(str1);

var str2 = content.replace(/ /g,"&nbsp;");

alert(str2);


分开写的话就没事了，str1替换回车，str2替换空格

可是写一起怎么就只替换空格呢？？

#11

将特殊字符替换掉

#12

今天刚看到一个键盘记录的例子，不知道对lz有没有帮助。比较菜，直贴源码了 


<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.0 Transitional//EN">

<HTML>

<HEAD><TITLE>js 按键记录</TITLE>

<META NAME="Generator" CONTENT="EditPlus">

<META NAME="Author" CONTENT="羽殇仁">

<META NAME="Keywords" CONTENT="js 按键记录">

<META NAME="Description" CONTENT="js 按键 记录">

</HEAD>

<BODY>

<script type="text/javascript">

var keystring = "";//记录按键的字符串

function $(s){return document.getElementById(s)?document.getElementById(s):s;}

function keypress(e)

{

　 var currKey=0,CapsLock=0,e=e||event;

　   currKey=e.keyCode||e.which||e.charCode;

　 CapsLock=currKey>=65&&currKey<=90;

　 switch(currKey)

　 {

   　 　 //屏蔽了退格、制表、回车、空格、方向键、删除键

   　 　 case 8: case 9:case 13:case 32:case 37:case 38:case 39:case 40:case 46:keyName = "";break;

   　 　 default:keyName = String.fromCharCode(currKey); break;

　 }

　 keystring += keyName;

}

function keydown(e)

{

　 var e=e||event;

　 var currKey=e.keyCode||e.which||e.charCode;

　 if((currKey>7&&currKey<14)||(currKey>31&&currKey<47))

　 {

　 　   switch(currKey)

   　 　 {

    　 　 　 case 8: keyName = "[退格]"; break;

    　 　 　 case 9: keyName = "[制表]"; break;

    　 　 　 case 13:keyName = "[回车]"; break;

    　 　 　 case 32:keyName = "[空格]"; break;

    　 　 　 case 33:keyName = "[PageUp]";   break;

    　 　 　 case 34:keyName = "[PageDown]";   break;

    　 　 　 case 35:keyName = "[End]";   break;

    　 　 　 case 36:keyName = "[Home]";   break;

    　 　 　 case 37:keyName = "[方向键左]";   break;

    　 　 　 case 38:keyName = "[方向键上]";   break;

    　 　 　 case 39:keyName = "[方向键右]";   break;

   　 　 　   case 40:keyName = "[方向键下]";   break;

    　 　 　 case 46:keyName = "[删除]";   break;

    　 　 　 default:keyName = "";    break;

　 　   }

　 　   keystring += keyName;

　 }

　 $("content").innerHTML=keystring;

}

function keyup(e)

{

　 $("content").innerHTML=keystring;

}

document.onkeypress=keypress;

document.onkeydown =keydown;

document.onkeyup =keyup;


</script>

<input type="text" />

<input type="button" value="清空记录" onclick="$('content').innerHTML = '';keystring = '';"/>

<br/>请按下任意键查看键盘响应键值：<span id="content"></span>


</BODY>

</HTML>

#13

引用 10 楼 sunshine_99 的回复:
JScript codevar content= document.getElementById('mailContent').value;var str1= content.replace(/\r\n/g,"</br>");
str1= content.replace(//g,"&nbsp;");alert(str1);

这么写的话，它只会替换空格，回车不管用

JScript codevar content= document.getElementById('mailContent').value;var str1= content.replace(/\r\n/g,"</br>");
alert(str1);var str2= content.replace(//g,"&nbsp;");alert(str2);

分开写的话就没事了，str1替换回车，str2替换空格

可是写一起怎么就只替换空格呢？？

var  content= document.getElementById('mailContent').value;
content=  content.replace(/\r\n/g,"</br>");
content=  content.replace(//g,"&nbsp;");
alert( content);
标签：

相关文章