百度编辑器UEditor是由百度FEX前端研发团队开发的所见即所得富文本web编辑器,万维景盛工程师在这里向大家介绍ASP版ueditor的嵌入使用方法。UEditor具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码。涵盖流行富文本编辑器特色功能,独创多种全新编辑操作模式。屏蔽各种浏览器之间的差异,提供良好的富文本编辑体验。
1、下载ueditor编辑器,根据网站编码而定,我这里用的是charset=gb2312" 编码,所以下载GBK编辑.
2、解压后放合适的位置.一般是放到根目录下,以便前后台调用.
3、去掉一些不必要的内容(文件和文件夹),精简编辑器,为了方便搬动,精简于最小.我是精简单到了1.97M.例如:_examples、_src文件夹去掉,到部署时使用压缩了的editor_all.js文件。根据实际情况,对一般的后台编辑表情也是可以不要的,所以我把表情也去掉了,当然要把前面的调用也去掉,否则会出错。
4、前期准备工作做好后,开始配置.重点文件是:editor_config.js,里面的注释讲得比较详细,路径没有配置好那整个编辑器就会有问题,我的配置如下,下面有部署后的绝对路径参考.
5、在添加和修改面页调用方法也很简单.
6、
①、添加页面加入的代码.
<script type="text/javascript" src="../ueditor/editor_config.js"></script> <script type="text/javascript" src="../ueditor/editor_all.js"></script> <link rel="stylesheet" href="../ueditor/themes/default/ueditor.css"/> <div id="myEditor"></div><script type="text/javascript"> var editor = new baidu.editor.ui.Editor(); editor.render("myEditor"); </script>
②、修改页面加入的代码.
<script type="text/plain" id="myEditor"><%=rs("ObjIntro")%></script> <script type="text/javascript"> var editor = new baidu.editor.ui.Editor(); editor.render("myEditor"); </script>
备注:如果是PHP架设Ueditor,方法是一样的,只是将<%换成<?php和/>