第一种
:比较麻烦 但也能实现
利用js正则
<
textarea
name
=
""
id
=
"txt"
cols
=
"30"
rows
=
"10"
>
</
textarea
>
<
input
type
=
"button"
id
=
"btn"
value
=
"点击按钮"
>
<
div
id
=
"desc"
>
</
div
>
</
body
>
<
script
>
var
txt = document.getElementById(
'txt'
)
var
btn = document.getElementById(
'btn'
)
var
desc = document.getElementById(
'desc'
)
btn.onclick =
function
()
{
var
val = txt.value
val = val.replace(
/\r\n/g
,
'<br/>'
);
val = val.replace(
/\n/g
,
'<br/>'
);
val = val.replace(
/\s/g
,
' '
);
desc.innerHTML = val;
</
script
>
第二种:
比较简单,几句css属性就可以解决了
首先用pre标签用来展示要显示的文本
但是如果文本在textarea没有换行 那么在pre里也不会换行 而是一直显示可能会超出文本框,这时候只要解决pre超出文本的问题就好了
pre{
white-space:pre-wrap;
white-space:-moz-pre-wrap;
white-space:-o-pre-wrap;
word-wrap:break-word;
加上这几个属性 就完美解决了。如果文本有换行 pre能换行显示,如果文本没有换行 pre也不会一行显示到底,也会在超出文本框的时候断行。
textarea里的文本手动加了换行在div里展示的时候还是成一行显示,有两种解决办法第一种:比较麻烦 但也能实现 利用js正则&lt;body&gt;&lt;textarea name="" id="txt" cols="30" rows="10"&gt;&lt;/textarea&gt;&lt;input type="button" i
关于textarea标签,真的是特别好用的,可以进行大量的文本编辑,提交起来也比较方便;
但是今天遇到一个问题,在我的jsp页面使用了textarea标签,但是编辑的时候按enter回车,并没有出现光标移动到下一行的操作
原来在html页面是可以很好的使用回车进行光标移动的,百度了半天都没有相关的属性能简单解决,然后自己写了一个事件才得以解决。
下面上代码:
jsp使用:
<tex...
layui本身内容超出是使用了隐藏,…的方式,但是有时候我们需要内容就算很长,也要显示出来,这时候就需要在页面上加以上样式来改变单元格的样式。
<style>
.layui-table-cell {
min-height: 30px;
height: initial;
.layui-ta......