index.jsp主要代码:
<html> <head> <title>网页编辑器</title> <script type="text/javascript" charset="utf-8" src="./ueditor/ueditor.config.js"></script> <script type="text/javascript" charset="utf-8" src="./ueditor/ueditor.all.js"></script> <LINK rel=stylesheet href="ueditor/themes/default/ueditor.css">
<script> <span style="white-space:pre"> </span>window.UEDITOR_HOME_URL = "/ueditor03/ueditor"; </script>
</head> <body> <div align="center"> <textarea id="newsEditor" name="content"> </textarea> <br/> <script type="text/javascript"> var editor = new UE.ui.Editor({initialFrameHeight:1000,initialFrameWidth:1000 }); editor.render('newsEditor'); /* UE.getEditor('newsEditor'); 上面的代码是设置网页编辑器的宽和高的,也就是大小。没有要求的话直接引用备注里的代码就可以 */ </script> </div> </body> </html>
- 打开editor_config.js配置文件
- 配置路径var URL = window.UEDITOR_HOME_URL || "/ueditor03/ueditor/"; 此处ueditor03是个人项目名称
- 注意index.jsp代码中的引用和body中的代码,因为ueditor版本的不同,要进行相对应的修改,具体情况具体分析。
- 到此可以发布运行项目,浏览器中可以进行编辑器的使用了!
- 从ckeditor、ueditor和一些动态的模板中的编辑器来看,ckeditor是引用代码,修改代码最简单,代码最具有普遍性的,但是一些功能还是不够完善;ueditor是百度的一款网页编辑器,不得不说,功能非常多且方便,但是版本太多,开发者使用的时候,要根据版本的不同进行相应的引用修改,实际上引用的代码也是大同小异的。
- 一些动态模板中的编辑器,颜色样式很好看,更侧重于美化,适当的时候可以更贴切整个系统的主题;一般功能都是最基础的,侧重于编辑比较少的文字内容;
- 另,下了一个浮动样式的编辑器,选择文字就弹出编辑框。但是遗憾的是,引用到系统中,并不好用,更适合作为一种已经写好的文字的格式修改方式;
- 后面会继续总结ueditor的一些使用方法和特点~~