ueditor文字編輯器
阿新 • • 發佈:2020-08-04
下載地址
jar地址
連結: https://pan.baidu.com/s/1P19vDAAOX4hjSe_HWuJJYg 提取碼: uw5c
靜態資源地址:
連結: https://pan.baidu.com/s/1mE2xl_LLx6yTt_N8f7jhxw 提取碼: qj7n
使用步驟
靜態資源匯入工程
在需要ueditor的頁面引入
<script charset="utf-8" src="../plugins/umedit/ueditor.config.js"</script> <script charset="utf-8" src="../plugins/umedit/ueditor.all.min.js"></script> <script charset="utf-8" src="../plugins/umedit/lang/zh-cn/zh-cn.js"></script>
示例:
在html指定位置中新增富文字
<div id="editor" name="article_content" style="width:1337px; height: 320px;"></div>
在底部初始化富文字
初始化完成後
<script type="text/javascript"> //初始化富文字程式設計器 var ue = UE.getEditor('editor'); ue.ready(function () { }); </script>
配置圖片上傳
引入pom依賴
<dependency> <groupId>commons-io</groupId> <artifactId>commons-io</artifactId> <version>2.4</version> </dependency> <dependency> <groupId>commons-codec</groupId> <artifactId>commons-codec</artifactId> <version>1.9</version> </dependency> <dependency> <groupId>com.fmjava</groupId> <artifactId>ueditor</artifactId> <version>1.0.0</version> </dependency> <dependency> <groupId>com.fmjava</groupId> <artifactId>json</artifactId> <version>1.0.0</version> </dependency>
其中ueditor和json為自己本地安裝Jar包
本地安裝方法
mvn install:install-file -DgroupId=com.fmjava -DartifactId=ueditor -Dversion=1.0.0 -Dpackaging=jar -Dfile=ueditor-1.0.0.jar
mvn install:install-file -DgroupId=com.fmjava -DartifactId=json -Dversion=1.0.0 -Dpackaging=jar -Dfile=json-1.0.0.jar
引數說明
-DgroupId
表示jar對應的groupId
<groupId>com.fmjava</groupId>
-DartifactId:
-DartifactId: 表示jar對應的artifactId
<artifactId>ueditor</artifactId>
-Dversion
-Dversion: 表示jar對應的 version
<version>1.0.0</version>
配置檔案上傳
配置檔案目錄
umedit/jsp/config.json
設定圖片訪問路徑字首
設定為你工程的埠地址
SpringMVC配置媒體解析器
<!-- 配置多媒體解析器 -->
<bean id="multipartResolver" class="org.springframework.web.multipart.commons.CommonsMultipartResolver">
<property name="defaultEncoding" value="UTF-8"></property>
<!-- 設定檔案上傳的最大值5MB,5*1024*1024 -->
<property name="maxUploadSize" value="5242880"></property>
</bean>