HTML5已从一个新的名词变成了我们在项目中经经常使用到的东西了,本日我们就来剖析一番个中contenteditable 。
contenteditable
是HTML5的一个新的特征,有能够你也相识过一些,然则由于你没在项目中碰到过,只知道contenteditable="true"
能够触发可编辑,关于如安在项目中的运用?会涌现什么题目呢?这些题目就是我们本日要说的。
先说说我碰到的。在一个项目中有个多行文本的输入,觉得textarea非常难以掌握,所以尝试运用contenteditable=”true”来模拟了一下。然则题目迥殊的严峻,他们的编辑内容居然有css款式,每次都邑发出去一些代码。然后就是复现题目,发明他们内容都是复制出来,然后他们经常使用的编辑器复制出来的内容,会带有css的表现为style标签。如许下来是不是是觉得没有办法?然后紧要切换回textarea?一般这个事变都是如许终局的,然则我们的故事不能如许终局。
contenteditable="plaintext-only"
从单词上看来是纯文本,那末我们测试一下 http://jsrun.net/hcYKp
是不是是迥殊的奇异呢?别急,css实在也是能够掌握是不是能够编辑-webkit-user-modify: read-write-plaintext-only
,那末我们测试一下 http://jsrun.net/hcYKp
固然这么酷的东西,兼容还不是很好,测试最好是在chrome内里举行