1.首先我要说明一下为什么要写这个博客,因为公司最近需要一个自定义的编辑器,苦于没有思路在网上找了好久,看到了好多android实现的编辑器(其实也就那么几个并不多),公司需求和网页端同步共享创建的文档,需要用到html保存数据,然后我就被迫开始了编辑器之旅,这东西我觉得最大的难点就是要手机和网页端保持一致,手机并没有那么自由统一起来还是非常困难的,接下来我就说说我遇到的一些问题.
问题一 : 我要实现这个样子
红框的地方就是要实现的地方 这里是这样的:
<div id="editor" contentEditable="true"> adfadf <span class="divcss5" >此DIV盒子左侧为1px实线蓝边框</span> adfadf </div>
我这里用div红框模拟一下如下图:
然后问题就出来了,此时我们的目的是如果现在光标在上图的红色方框后面的话按下退格键需要删除整个div 而现在点击退格键删除的不是整个div而是div中的内容,这里我们想要的效果是删除红色的框子div,但现在如下图:
现在就比较尴尬了。
解决方法:
其实也很简单就是 把 contenteditable="true"属性从div上拿掉移到body上 如果你想删的div不想像上图一样的话就在那个div上添加 contenteditable="false" 就行了
<!DOCTYPE HTML> <html> <body contenteditable="true"> <div> 调调 <div contenteditable="false"> 呵呵呵 </div> 这是一段可编辑的段落。请试着编辑该文本。 </div> </body> </html>
原文:http://www.cnblogs.com/woaixingxing/p/6346780.html