最近因工作需要使用了ueditor,根据自己的需求将开发使用时遇到的问题小结分享下。

1.可到官网根据自身情况下载最新版本,https://ueditor.baidu.com/website/

2.html页面调用并引入js插件

<div>
                            <!-- 富文本 -->
                            <textarea name="content" id="myEditor" style="height:300px;"></textarea>
                        </div>

<!--script引入富文本-->
<!-- 配置文件,须首先引入 -->
<script src="__PUBLIC__/Home/ueditor/1.4.3/ueditor.config.js" type="text/javascript"></script>

<!-- 编辑器源码文件 -->
<script src="__PUBLIC__/Home/ueditor/1.4.3/ueditor.all.js" type="text/javascript"></script>

<!-- 实例化编辑器,并设置要显示的标签等,这里我需要的toolbar标签就这些,自己可参考文档自定义设置 -->
<script type="text/javascript">
    UE.getEditor('myEditor',{
        toolbars: [
            ['undo', 'redo', 'insertimage']
        ],
        autoHeightEnabled: true,    //是否自动长高,默认true
        autoFloatEnabled: true,     //是否保持toolbar的位置不动,默认true
        elementPathEnabled: false   //是否启用元素路径,默认是显示
    });
</script>

ok,如下图:

PS-小结::::::

1.修改不显示‘本地已保存’的提示(1.4.3版本中)

2.去掉元素路径、字数统计等

3.因为我将上传的信息进行处理,规避了一些特殊字符,所以存到数据库时,出现了被转义问题,并且页面显示出错

4.上传的图片太大没有自动缩放问题:可在富文本插件的根目录下找到themes->iframe.css文件,并在其中敲入以下代码,注意缓存

img {
    max-width: 65%; /*图片自适应宽度*/

max-height: 65%; /*图片自适应高度*/
}
body {
    overflow-y: scroll !important;
}
.view {
    word-break: break-all;
}
.vote_area {
    display: block;
}
.vote_iframe {
   
    border: 0 none;
    height: 100%;
}
#edui1_imagescale{display:none !important;} /*去除点击图片后出现的拉伸边框*/

前:::

后:::

5.上传图片提交后太后在页面显示的同样太大,可在html页面通过定位到对应的img,敲入style,如:img{max-width:100%;}

6.开发环境上传图片等可正常使用,但在运行环境却不行,报错如:后台配置项返回格式出错,上传功能将不能正常使用!

原因/解决:php目录下的controller文件中的date_default_timezone_set函数大小写问题/改为date_default_timezone_set("Asia/Chongqing");即可

7.注意、注意、注意:引入富文本插件时,文件顺序一定不能错,否则无法引入!!!!!config文件在最前

以上就是目前遇到的问题,不足之处,多多指教,共同进步

百度富文本ueditor使用小结的更多相关文章

  1. 百度富文本Ueditor将图片存在项目外路径并回显

    我的毕设中需要一个类似新闻发布的功能,使用到百度富文本编辑器,不过百度富文本编辑器有点坑(只是我太菜了),粘贴图片和回显这个坑坑了我两天时间.效果是这样的: 就是可以在文本中粘贴图片并显示出来,直接说 ...

  2. 百度富文本Ueditor编辑器的使用

    往在web开发的时候,尤其是在网站开发后台管理系统的时候经常会使用到富文本编辑器,这里我们来使用百度提供的富文本编辑器UEditor,以提高我们的开发效率 UEditor官网下载地址:https:// ...

  3. springboot使用百度富文本UEditor遇到的问题一览(springboot controller中request.getInputStream无法读取)

    先吐槽一下UEditor作为一个前端的js类库,非要把4种后端的代码给出来,而实际生产中用的框架不同,其代码并不具有适应性.(通常类似其它项目仅仅是给出数据交互的规范.格式,后端实现就可以自由定制) ...

  4. springboot+layui 整合百度富文本编辑器ueditor入门使用教程(踩过的坑)

    springboot+layui 整合百度富文本编辑器ueditor入门使用教程(踩过的坑) 写在前面: ​ 富文本编辑器,Multi-function Text Editor, 简称 MTE, 是一 ...

  5. UEditor百度富文本编辑器--让编辑器自适应宽度的解决方案

    UEditor百度富文本编辑器的initialFrameWidth属性,默认值是1000. 不能够自适应屏幕宽度.如图1: 刚开始的时候,我是直接设置initialFrameWidth=null的.效 ...

  6. 百度富文本编辑器UEditor安装配置全过程

    网站开发时富文本编辑器是必不可少的,他可以让用户自行编辑内容的样式然后上传到后台!下面我们来介绍如何安装使用百度富文本编辑器 一.下载并且设置百度富文本编辑器的样式     你可以去百度UEditor ...

  7. 百度富文本编辑器ueditor使用总结

    最近做的项目用到了ueditor这个东东,但是他的一些配置文档对初次使用者来说很难以理解,故作此总结 相关详细操作链接地址: http://blog.csdn.net/wusuopubupt/arti ...

  8. 百度富文本编辑器ueditor在jsp中的使用(ssm框架中的应用)

    折腾了一下午终于把百度富文本编辑器ueditor搞定了!   项目地址:https://github.com/724888/lightnote_new     首先我参考了一个ueditor的demo ...

  9. Html引入百度富文本编辑器ueditor

    在日常工作用,肯定有用到富文本编辑器的时候,富文本编辑器功能强大使用方便,我用的是百度富文本编辑器,首先需要下载好百度编辑器的demo, 然后创建ueditor.html文件,引入百度编辑器,然后在h ...

随机推荐

  1. Java线程的创建方式三:Callable(四)

    一.Java实现多线程的三种方式 方式一:继承Thread类: public class Test extends Thread { public static void main(String[] ...

  2. Eclipse 安装Activiti插件(BPMN打开工具)

    在Eclipse的菜单中打开help -> install new software: 单击add: Name: Activiti BPMN 2.0 designer Location: htt ...

  3. Android 修改 Menu字体颜色

    转载:http://blog.csdn.net/jayyuz/article/details/55260996 @Override public boolean onCreateOptionsMenu ...

  4. SDOI2017 Round1 简要题解

    我们 TM 怎么又要上文化课..我 哔哔哔哔哔哔 「SDOI2017」数字表格 题意 有 \(T\) 组数据,求 \[ \prod_{i = 1}^{n} \prod_{j = 1}^{m} fib[ ...

  5. Hdoj 1846.Brave Game 题解

    Problem Description 十年前读大学的时候,中国每年都要从国外引进一些电影大片,其中有一部电影就叫<勇敢者的游戏>(英文名称:Zathura),一直到现在,我依然对于电影中 ...

  6. 【WC2018】即时战略(动态点分治,替罪羊树)

    [WC2018]即时战略(动态点分治,替罪羊树) 题面 UOJ 题解 其实这题我也不知道应该怎么确定他到底用了啥.只是想法很类似就写上了QwQ. 首先链的部分都告诉你要特殊处理那就没有办法只能特殊处理 ...

  7. 【UOJ#246】套路(动态规划)

    [UOJ#246]套路(动态规划) 题面 UOJ 题解 假如答案的选择的区间长度很小,我们可以做一个暴力\(dp\)计算\(s(l,r)\),即\(s(l,r)=min(s(l+1,r),s(l,r- ...

  8. 题解 P4512 【【模板】多项式除法】

    题目地址 前言 原理有大佬写了 所以蒟蒻只讲下本题的代码细节 我看懂的大佬博客:博客地址 因为可能知道了大致的步骤还有很多细的地方不理解导致写的时候要花很久并且看到大佬们好像都是用递归写的希望能有帮助 ...

  9. hdu2586How far away ?(LCA LCATarjan离线)

    题目链接:acm.hdu.edu.cn/showproblem.php?pid=2586 题目大意:有n个点,同n-1条带有权值的双向边相连,有m个询问,每个询问包含两个数x,y,求x与y的最短距离. ...

  10. QML学习笔记(三)-引入Font-awesome

    作者: 狐狸家的鱼 Github: 八至 1.首先得在qml文件夹下建立字体文件,将font-awesome放入进去 2.然后在main.cpp中注册字体 引入中一定要写上 引用字体 引用字体得路径一 ...