推荐一个很好的富文本web编辑器UEditor

前天产品提了一个编辑器的bug，本人找是找到了问题的症结，就是不好改。框架是压缩兼混淆后的代码。查一下，好多年前的框架。。。

咨询了一个同事有关旧框架的事情，他也建议我升级编辑器并帮忙帮我找了UEditor。嘻嘻。。。。

不错，开源，文档也很好用。由百度web前端研发部开发。符合中国国情，ie6也支持的不错！

官方地址：http://ueditor.baidu.com/website/index.html

 

1.部署方法(php版本)

a.下载项目需要的版本源码，以php为例

b.文本编辑框所放的位置

    <div>

    <script type="text/plain" id="myEditor" name="myContent"> //默认文字内容或修改的内容 </script>

    </div>

c.加载框架脚本

<script type="text/javascript"> window.UEDITOR_HOME_URL = "ueditor/"; //一定要放在最前面 </script>

<script type="text/javascript" charset="utf-8" src="ueditor/ueditor.all.js"lt;</script> <script type="text/javascript" charset="utf-8" src="ueditor/ueditor.config.js"></script>

<script type="text/javascript"> UE.getEditor('myEditor', { initialFrameWidth:600,//初始化宽度 initialFrameHeight:540,//初始化高度 toolbars:[["source","|","undo","redo","|","bold","italic","underline"],["paragraph","fontfamily","fontsize","|","inserttable","deletet able","mergeright""],["searchreplace","|","insertimage","emotion"]]//自定义工具栏 三行 }); </script>

//$_POST['myContent'] 上传内容到服务器

编辑框初始化完成。

2.配置上传图片路径

a.修改imageUp.php

$config = array(

   "savePath" => ($path == "1" ? "../../../../uploads/news/images/": "upload1/"),

   "maxSize" => 1000, //单位KB

   "allowFiles" => array(".gif", ".png", ".jpg", ".jpeg", ".bmp")

   );

b.修改dialogs /image/image.html

    <div class="saveDir"gt; <var id="lang_savePath" ></var><select id="savePath">

    <option value="1>uploads</option> <!--option value="2">upload1</option-->

    </select>

    </div>

c.修改getRemoteImage.php

 //远程抓取图片配置

 $config = array(

   "savePath" => '../../../../uploads/news/images/'.$userId ,            //保存路径

   "allowFiles" => array( ".gif" , ".png" , ".jpg" , ".jpeg" , ".bmp" ) , //文件允许格式

   "maxSize" => 3000                    //文件大小限制，单位KB

   );

基本功能也就完成。一般上传不了图片，大部分都是路径配置的不对。

补充一点：

如果想非全屏下显示滚动条：ueditor.config.js里面找到autoHeightEnabled 设置为false