H5设计一个简单的在线编辑器

上面的代码,就是编辑器的代码,把对象直接绑定到window对象中,方便调用;

接下来,就是实现了,首先我们需要一个DOM对象来绑定编辑器:

\<\div class=\"contentEditable\"\>\<\/div\>
自己新建了一个div,这里最好使用ID,本人是测试,所以懒;

然后调用编辑器对象的init方法,初始化编辑器;

editorUtils.init(document.getElementsByClassName(\”contentEditable\”)[0]);
init的方法,主要是设置编辑器的高度宽度,已经class样式,继承绑定对象的属性,我只写了一个class绑定,之后就把绑定对象隐藏起来;

然后大功告成了,现在可以编辑内容了,我们来看一下截图:

 
Copyright © 2008-2021 lanxinbase.com Rights Reserved. | 粤ICP备14086738号-3 |