UMEditor配置

UMEditor配置

最近項(xiàng)目中需要用到富文本客戶(hù)端。確定使用umeditor。首先在官網(wǎng)下載相應(yīng)文件

http://ueditor.baidu.com/website/download.html

筆者選擇的jsp版本的。

目錄結(jié)構(gòu)如下

下面講講配置整合的經(jīng)過(guò)。

引入相應(yīng)js 及css。要注意順序。

jquery.min.js  
third-party/template.min.js  
umeditor.min.js
umeditor.config.js
themes/default/css/umeditor.min.css

頁(yè)面定義div

<div type="text/plain"id="career" name="career"  Readonly="true">
    <script type="text/javascript">
        mini.parse();
        var um = UM.getEditor('career');
 </script>

 整合完畢

umeditor.config.js是相應(yīng)的配置文件，里面的說(shuō)明比較全面。筆者需要自定義國(guó)際化和圖片存儲(chǔ)路徑

寫(xiě)了兩個(gè)js

  function getPath () {
//根路徑
        varpathName=location.pathname;
       var host = 'http://'+location.host;
        returnhost+pathName.substring(0,pathName.substr(1).indexOf('/')+1);
 }
 
function getLanguage() {
     var language =getCookie("language");
     if(null ==language|| ""==language){
       language = navigator.browserLanguage?navigator.browserLanguage:navigator.language;
     }
     language =language.substring(0,2);
      if(language!="zh"){
        language ="en";
      }else{
        language ="zh-cn";
      }
     return language;
}

在umeditor.config.js 配置時(shí)進(jìn)行引用

,p_w_picpathPath: getPath()+"/"     //是取圖片時(shí)的路徑
,lang: getLanguage()
,p_w_picpathUrl:URL+"jsp/p_w_picpathUp.jsp"             //圖片上傳提交地址
p_w_picpathUrl 這個(gè)參數(shù)是p_w_picpathUp.jsp 所在路徑，如果配置不對(duì)上傳圖片會(huì)404（可以不改）

本人將圖片另放一個(gè)自定義目錄

首先修改p_w_picpathUp.jsp 中上傳路徑

注意要引入

<%@ page import="com.manage.common.util.Uploader" %>

注意自己的路徑

默認(rèn)是upload

修改setSavePath("img/upload") 中參數(shù)即可

同時(shí)還需修改Uploader.java 中獲取絕對(duì)路徑的方法

 private String getPhysicalPath(String path) {
       
       /*String servletPath =this.request.getServletPath();
       String realPath =this.request.getSession().getServletContext()
              .getRealPath(servletPath);
       return new File(realPath).getParent() +"/" +path;*/
       
       returnthis.request.getSession().getServletContext().getRealPath("/") + "/" + path;
        }

自此完成配置圖片上傳自定義位置