博客
关于我
强烈建议你试试无所不能的chatGPT,快点击我
HTML5关于 contenteditable 介绍
阅读量:6482 次
发布时间:2019-06-23

本文共 588 字,大约阅读时间需要 1 分钟。

HTML5已经从一个新的名词变成了我们在项目中经常用到的东西了,今天我们就来分析一番其中contenteditable 。

contenteditable是HTML5的一个新的特性,有可能你也了解过一些,但是因为你没在项目中遇到过,只知道contenteditable="true"可以触发可编辑,对于如何在项目中的应用?会出现什么问题呢?这些问题就是我们今天要说的。

先说说我遇到的。在一个项目中有个多行文本的输入,感觉textarea异常难以控制,所以尝试使用contenteditable="true"来模拟了一下。但是问题特别的严重,他们的编辑内容居然有css样式,每次都会发出去一些代码。然后就是复现问题,发现他们内容都是复制出来,然后他们常用的编辑器复制出来的内容,会带有css的表现为style标签。这样下来是不是感觉没有办法?然后紧急切换回textarea?通常这个事情都是这样结局的,但是我们的故事不能这样结局。

contenteditable="plaintext-only" 从单词上看来是纯文本,那么我们测试一下

是不是特别的神奇呢?别急,css其实也是可以控制是否可以编辑-webkit-user-modify: read-write-plaintext-only,那么我们测试一下

当然这么酷的东西,兼容还不是很好,测试最好是在chrome里面进行

转载地址:http://rbbuo.baihongyu.com/

你可能感兴趣的文章
SCALA中的函数式编程
查看>>
Windows删除无效服务
查看>>
将List<int> 转换为用逗号连接为字符串
查看>>
C/C++中extern关键字详解
查看>>
Eclipse 最有用的快捷键
查看>>
K & DN 的前世今生(微软开源命名变革)
查看>>
--@angularJS--angular与BootStrap3的应用
查看>>
u3d单词学习plane
查看>>
10款很好用的 jQuery 图片滚动插件
查看>>
Flask服务入门案例
查看>>
ReadWriteLock与ReentrantReadWriteLock
查看>>
Atitit.软件命名空间 包的命名统计 及命名表(2000个名称) 方案java package...
查看>>
新手指导:教你如何查看识别hadoop是32位还是64位
查看>>
Codeforces Round #180 (Div. 2) D. Fish Weight 贪心
查看>>
Gradle sourceCompatibility has no effect to subprojects(转)
查看>>
百度指数分析
查看>>
使用Mkdocs构建你的项目文档
查看>>
三分钟读懂TT猫分布式、微服务和集群之路
查看>>
fn project 运行时配置选项
查看>>
你的leader还在考核你的千行代码Bug率吗?
查看>>