推薦一個很好的富文本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