此文是针对textarea标签的换行问题,比如说我在textarea编辑框中输入多行(如果不加<br />),然后获取值显示在div中,得到的只有一行,现在是我想在textarea中输入什么样的格式,然后在div中显示什么样的格式 ,应该怎样来解决呢?
解决的方法还是有的,下面的代码就是可以解决,来实现上面所想要的功能,如下的代码细节:
JavaScript code:
<!DOCTYPE >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script src="http://www.znjcx.com/ajax/libs/jquery/1.7.2/jquery.js" type="text/javascript"></script>
<style type="text/css">
</style>
<script type="text/javascript">
$(function(){
$("#textarea1").keyup(function(){
$("#div2").html($("#textarea1").val().replaceAll("\n","<br>"));
});
});
String.prototype.replaceAll = function(s1, s2) {
var r = new RegExp(s1.replace(/([\(\)\[\]\{\}\^\$\+\-\*\?\.\"\'\|\/\\])/g,"\\$1"),"ig");
return this.replace(r,s2);
}
</script>
</head>
<body>
<textarea id="textarea1" style="width:200px;height:100px;"></textarea>
<div id="div2" style="width:200px;height:100px;border:dashed 1px red;overflow-y:auto;"></div>
</body>
</html>
更多关于换行的问题如下:
1.php解析后为何出现换行?
2.关于td换行的问题
3.html块之间换行
4.如何让span并排不换行?
解决的方法还是有的,下面的代码就是可以解决,来实现上面所想要的功能,如下的代码细节:
JavaScript code:
<!DOCTYPE >
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=gb2312" />
<script src="http://www.znjcx.com/ajax/libs/jquery/1.7.2/jquery.js" type="text/javascript"></script>
<style type="text/css">
</style>
<script type="text/javascript">
$(function(){
$("#textarea1").keyup(function(){
$("#div2").html($("#textarea1").val().replaceAll("\n","<br>"));
});
});
String.prototype.replaceAll = function(s1, s2) {
var r = new RegExp(s1.replace(/([\(\)\[\]\{\}\^\$\+\-\*\?\.\"\'\|\/\\])/g,"\\$1"),"ig");
return this.replace(r,s2);
}
</script>
</head>
<body>
<textarea id="textarea1" style="width:200px;height:100px;"></textarea>
<div id="div2" style="width:200px;height:100px;border:dashed 1px red;overflow-y:auto;"></div>
</body>
</html>
PS:用replace是不行的!如果是上面的这种代码,用replace的话, 只能替换一个回车,所以一定要用上面代码中的那个自定义的 replaceAll!
此文由Web开发之答疑解惑源(http://www.znjcx.com)整理而成,若需转载,请注明转载出处:http://www.znjcx.com/html/y2012/4187_textarea.html,谢谢!
更多关于换行的问题如下:
1.php解析后为何出现换行?
2.关于td换行的问题
3.html块之间换行
4.如何让span并排不换行?
5.如何去除字符串前后的换行回车?
请参阅www.znjcx.com。
转载于:https://blog.51cto.com/znjcx/1071190