1. 程式人生 > >百度富文字編輯器UEditor的使用總結

百度富文字編輯器UEditor的使用總結

在你的web工程或網站根目錄下,新建一個名稱叫ueditor資料夾,把下載ueditor解壓後貼上到你新建的這個資料夾中
4.在你的jsp頁面中一如富文字編輯器
   1.引入相關js和css
      <script type="text/javascript" src="${basePath}/admin/ueditor/ueditor.config.js"></script>
       <script type="text/javascript" src="${basePath}/admin/ueditor/ueditor.all.js"></script>
      <script type="text/javascript" src="${basePath}/admin/ueditor/lang/zh-cn/zh-cn.js"></script>
       <link rel="stylesheet" type="text/css" href="${basePath}/admin/ueditor/themes/default/ueditor.css" />
    2.新增編輯器
       <div class="form-group">
                            <label class="control-label col-md-3">內容</label>
                            <div class="col-md-6">

                                <textarea id='myEditor' name="content" style="margin-top: 30px;">
                                       <c:out value="${record.content}"></c:out>
                                </textarea>
                            </div>
         </div>
         
          <script type="text/javascript">
                var basePath = "${basePath}";
         </script>
          <script type="text/javascript">
                var editor = new UE.ui.Editor();
                editor.render('myEditor');
                UE.Editor.prototype._bkGetActionUrl = UE.Editor.prototype.getActionUrl;
                UE.Editor.prototype.getActionUrl = function(action){
                if(action == 'upload/image'){
                       return basePath+'/upload/images';
                }else{
                       return this._bkGetActionUrl.call(this, action);
                }
             }
          </script> 

    3.修改ueditor資料夾下邊的editor_config.js

           var URL = window.UEDITOR_HOME_URL || "/zxzl/admin/ueditor/";
           註釋:zxzl是工程名
    4.修改ueditor資料夾下jsp資料夾下的config.json檔案