maven项目中-富文本编辑器-百度ueditor-的使用

最新推荐文章于 2024-08-22 17:44:20 发布

纸箱人丶

最新推荐文章于 2024-08-22 17:44:20 发布

阅读量2.3k

点赞数 2

分类专栏：前台文章标签：富文本编辑器

本文链接：https://blog.csdn.net/weixin_42772196/article/details/90292021

版权

maven项目中-富文本编辑器-百度ueditor-的使用

一、下载ueditor插件包
https://ueditor.baidu.com/website/download.html
在这里插入图片描述

二、将插件放入maven项目中
在这里插入图片描述
三、引入依赖

mven依赖

<dependency>
            <groupId>com</groupId>
            <artifactId>baidu</artifactId>
            <version>1.1.2</version>
        </dependency>
		<dependency>
			<groupId>org.json</groupId>
			<artifactId>json</artifactId>
			<version>20160810</version>
		</dependency>
		<dependency>
		    <groupId>commons-io</groupId>
		    <artifactId>commons-io</artifactId>
		    <version>2.4</version>
		</dependency>
		<dependency>
			<groupId>commons-fileupload</groupId>
			<artifactId>commons-fileupload</artifactId>
			<version>1.3.1</version>
		</dependency>
		<dependency>
			<groupId>commons-codec</groupId>
			<artifactId>commons-codec</artifactId>
			<version>1.9</version>
		</dependency>

如果ueditor-1.1.2.jar无法引入的话需手动引入

mvn install:install-file -Dfile=ueditor-1.1.2.jar -DgroupId=com.baidu -DartifactId=ueditor -Dversion=1.1.2 -Dpackaging=jar

四、前台页面以及配置
直接使用官方给的index.html页面就可以，这里我也粘一份

<%@ page language="java" contentType="text/html; charset=UTF-8"
    pageEncoding="UTF-8"%>
<%@taglib uri="http://java.sun.com/jsp/jstl/core" prefix="c"  %>
<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>

<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>Insert title here</title>
<script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/plugins/ueditor/ueditor.config.js"></script>
    <script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/plugins/ueditor/ueditor.all.js"> </script>
    <script type="text/javascript" charset="utf-8" src="${pageContext.request.contextPath }/plugins/ueditor/lang/zh-cn/zh-cn.js"></script>
	<style type="text/css">
        div{
            width:100%;
        }
    </style>
	
</head>
<div>
<!--     <script id="editor" type="text/plain" style="width:1024px;height:500px;"></script> -->