一、使用textarea标签进行多行文本的输入有很多限制,比如不能实现高度自适应,会出现难看的滚动条等问题。

  HTML5中添加了一个新属性contenteditable,该属性可以让input,textarea以外的不可编辑的标签具备可编辑功能;

  用法如下:

//contenteditable="true"  当属性值为true的时候,可编辑标签内可以写入标签,对于复制的具有样式的内容,其样式会保留;
<div contenteditable="true">我是可编辑的富文本框</div>

//contenteditable="plaintext-only"  当属性值为plaintext-only时,该可编辑标签内只能写入纯文本的数据,对于复制的具有样式的内容,会转换为纯文本,而将样式标签等内容过滤掉;
<div contenteditable="plaintext-only"></div>

 

二、如果不使用该属性,可以使用js控制textarea的高度;原理是当textarea出现滚动条时,增加其高度,使滚动条消失。

  怎样判断是否出现滚动条,其方法是但元素的scrollHeight大于offsetHeight的时候,即出现了滚动条;

  实现方法如下:

//html
<textarea >})

 

相关文章:

  • 2021-12-21
  • 2022-12-23
  • 2021-12-14
  • 2021-12-21
  • 2022-12-23
  • 2021-11-30
  • 2022-12-23
猜你喜欢
  • 2021-12-21
  • 2021-12-21
  • 2022-12-23
  • 2022-12-23
  • 2021-12-21
  • 2021-12-21
  • 2022-12-23
相关资源
相似解决方案