ueditor1_4_3_3编辑器的应用

最新推荐文章于 2021-12-07 22:00:28 发布

lyuharvey

最新推荐文章于 2021-12-07 22:00:28 发布

阅读量202

点赞数

文章标签：数据库 javascript ViewUI

教程使用的是ueditor1_4_3_3版本。

首先到官网http://ueditor.baidu.com/website/download.html下载jsp utf-8版

下载好以后，解压，把解压文件夹命名为ueditor

然后把ueditor目录整个复制到webapp下

在自己需要编辑器的页面引入ueditor的js

在body中:

<head></head>中:

<script type="text/javascript">
            //实例化编辑器
            //建议使用工厂方法getEditor创建和引用编辑器实例，如果在某个闭包下引用该编辑器，直接调用UE.getEditor('editor')就能拿到相关的实例
            var ue = UE.getEditor('editor');
</script>

把ueditor/jsp/lib下的jar包全部添加到项目里。

另外还需要一个jar包，此处在pom.xml配置了：

    <dependency>
        <groupId>javax.servlet</groupId>
        <artifactId>servlet-api</artifactId>
        <version>2.5</version>
    </dependency>

然后在ueditor.config.js中找到,zIndex : 900 并去掉注释，修改值为 999999

修改附件上传目录:

部署，去掉部署项目名：

保存以后要展示时，在需要代码高亮的页面配置:

还要把后台取数据的ajax变为同步加载！

需要展示的时候自动换行在相应css添加下面代码即可：

编辑器中添加代码是背景色修改:

编辑器中图片自适应:

iframe.css中添加

/*可以在这里添加你自己的css*/
img {
    max-width: 100%; /* 图片自适应宽度 */
}

body {
    overflow-y: scroll !important;
}

.view {
    word-break: break-all;
}

.vote_area {
    display: block;
}

.vote_iframe {
    background-color: transparent;
    border: 0 none;
    height: 100%;
}

一些技巧：

uuditor常用的js函数在ueditor/index.html里面能找到，比如获取编辑框里面的内容等等。

注意如果上传到服务器html源码数据库表字段是用longtext接收的，那么此jar包要换到1.4及以上版本，不然会报错

lyuharvey

关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
ueditor1_4_3_3编辑器的应用

教程使用的是ueditor1_4_3_3版本。首先到官网http://ueditor.baidu.com/website/download.html下载jsp utf-8版下载好以后，解压，把解压文件夹命名为ueditor然后把ueditor目录整个复制到webapp下在自己需要编辑器的页面引入ueditor的js在body中:&lt;head&gt;&lt;...
复制链接

扫一扫