码迷,mamicode.com
首页 > 其他好文 > 详细

div可编辑框,去除粘贴文字样式😄

时间:2017-11-22 13:17:15      阅读:134      评论:0      收藏:0      [点我收藏+]

标签:插入图片   developer   asc   做了   mozilla   develop   https   有一个   tps   

  上个月做了个聊天的需求(网页版的)。说到聊天都想到输入框,说到输入框都会想到input,但是input标签是不支持插入图片的(包括areatext标签)。查阅了一些资料就看到div标签有一个属性contenteditable,这个属性设置为true的话,div会变成可编辑状态,非常神奇,而且是可以插入图片的。

  之所以写这篇文章当然不是只为了说这个简单的事情啦。因为开发的时候会遇到一个事情,就是复制别的地方的带样式的文字的时候,粘贴到div里,特么会把样式带上,可把我烦死了。各种查阅资料怎么去除样式,但是恕我直言,大部分人的文章都解决不了我的问题。我也有想过要么自己去获取粘贴的内容进行过滤,但是。。。。不现实啊,层级嵌套的深一些的dom就很难很难很难。

  柳暗花明又一村,看了w3c的草案,才知道contenteditable这个属性可不止 true or false。

contenteditable=""
contenteditable="events"
contenteditable="caret"
contenteditable="plaintext-only"
contenteditable="true"
contenteditable="false"

  大概有这些,其他的我不知道,但是 ‘plaintext-only’这个属性,我一眼就看到,从字面上理解,就是只保存纯文本,哇!!简直太棒了吧,马上上代码试了试,果不其然,粘贴进来的文字,全部样式都去除!!!

  以上。

div可编辑框,去除粘贴文字样式😄

标签:插入图片   developer   asc   做了   mozilla   develop   https   有一个   tps   

原文地址:http://www.cnblogs.com/Nick-chen/p/7878477.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!