第一步：下载编辑器

到官网下载 umeditor 最新版源码版本，下载之后打开 _examples/index.html 就可以看到演示例子。[下载页面]

第二步：部署编辑器到页面

    解压下载的包，放到你的项目中。

    在你的页面要插入编辑器的位置，插入代码：

<!-- 加载编辑器的容器 -->

<script id="container" name="content" type="text/plain" style="width:600px;height:200px;">

    这里写你的初始化内容

</script>

    在<head></head>标签最后，插入需要引用的文件和实例化编辑器的代码(注意修改引用文件的路径)：

<!-- 样式文件 -->

<link rel="stylesheet" href="./umeditor/themes/default/css/umeditor.css">

<!-- 引用jquery -->

<script src="./umeditor/third-party/jquery.min.js"></script>

<!-- 配置文件 -->

<script type="text/javascript" src="./umeditor/umeditor.config.js"></script>

<!-- 编辑器源码文件 -->

<script type="text/javascript" src="./umeditor/umeditor.js"></script>

<!-- 语言包文件 -->

<script type="text/javascript" src="./umeditor/lang/zh-cn/zh-cn.js"></script>

<!-- 实例化编辑器代码 -->

<script type="text/javascript">

    $(function(){

        window.um = UM.getEditor('container', {

            /* 传入配置参数,可配参数列表看umeditor.config.js */

            toolbar: ['undo redo | bold italic underline']

        });

    });

</script>

    这时候你再浏览器打开你的页面，看到下面这样的编辑器，说明你已部署成功。 部署成功

第三步：获取和设置编辑器的内容

/* 获取编辑器内容 */

var html = um.getContent();

var txt = um.um.getContentTxt();

/* 设置编辑器内容 */

um.setContent('要设置的编辑器内容.');

相关链接

UMeditor官网: http://ueditor.baidu.com

百度 迷你版 UMeditor富文本编辑器 使用方法的更多相关文章

  1. 百度umeditor富文本编辑器插件扩展

    富文本编辑器在WEB开发中经常用到,个人比较喜欢用百度出的ueditor这款,ueditor这款本身支持插件扩展的,但是ueditor的mini版本 umeditor 就没有那么方便了,不过找了很多资 ...

  2. 使用百度UMeditor富文本编辑器，修改自定义图片上传，修改源码

    富文本编辑器,不多说了,这个大家应该都用到过,至于用到的什么版本,那就分很多种 CKEditor:很早以前叫FCK,那个时候也用过,现在改名了,比较流行的一个插件,国外很多公司在用 UEDITOR:百 ...

  3. JSP嵌入ueditor、umeditor富文本编辑器

    一.下载: 1.什么是富文本编辑器?就是: 或者是这个: 其中第一个功能比较详尽,其主要用来编写文章,名字叫做udeitor. 第二个就相对精简,是第一个的MINI版,其主要用来编辑即时聊天或者发帖, ...

  4. 使用UMeditor富文本编辑器上传图片

    注:本文系作者原创,但可随意转载. 最近写自己的网站玩儿,写到博客的部分,打算使用UMeditor,因为之前也用过(但是好像没实现图片上传的功能),感觉用起来还比较简单. 不过还是折腾了一下午...遇 ...

  5. PHP接入umeditor(百度富文本编辑器)

    2015年6月28日 23:08:49 星期日 效果: 开搞;) 首先: 百度官网上下载 umeditor 简版的富文本编辑器(这里) 然后: 解压放到自己的项目中, 配置服务器, 保证能在浏览器端加 ...

  6. PHP如何搭建百度Ueditor富文本编辑器

    本文为大家分享了PHP搭建百度Ueditor富文本编辑器的方法,供大家参考,具体内容如下 下载UEditor 官网:下载地址 将下载好的文件解压到thinkphp项目中,本文是解压到PUBLIC目录下 ...

  7. django之百度Ueditor富文本编辑器后台集成

    Python3 + Django2.0 百度Ueditor 富文本编辑器的集成 百度富文本编辑器官网地址:http://fex.baidu.com/ueditor/ 疑问:为什么要二次集成? 答案:因 ...

  8. WPF开发时光之痕日记本（一）——富文本编辑器

    本篇给大家推荐一个 WPF 版的富文本编辑器,SmithHtmlEditor,具体网址大家可以找一找,我在这个编辑器的基础上修改了界面,增加了一些功能,模仿了kindeditor 的界面,鉴于自己现在 ...

  9. Java-Swing中使用Web富文本编辑器

    资料下载 (截取出了邮件发送的功能.) 2018/11/10 因为要 win7 电脑 IE 8 的原因,使用了 jxBrower 拓展,更容易使用,参考链接(推荐) 问题介绍 window客户端软件的 ...

随机推荐

  1. AdapterView的相关知识。

    AdapterView集成自ViewGroup,他的主要子类有AbsListView(Listview,GridView),AbsSpinner(Spinner,Gallery). AdapterVi ...

  2. php 通过PATH_SEPARATOR判断当前服务器系统类型

    PATH_SEPARATOR是php中的一个预定义常量,我们可以直接echo这个常量,在linux系统中,该常量输出":",在windows系统中,该常量输出";&quo ...

  3. socket 和 SocketServer 模块

    一 .Socket 网络上的两个程序通过一个双向的通信连接实现数据的交换,这个连接的一端称为一个socket socket(TCP,IP)通常也称作"套接字",用于描述IP地址和端 ...

  4. CentOS安装 Docker

    系统的要求64 位操作系统,内核版本至少为 3.10. Docker 目前支持 CentOS 6.5 及以后的版本,推荐使用 CentOS 7 系统. cat /proc/version 首先,也是要 ...

  5. php头函数和浏览器缓存

    可以通过php头函数改变返回给浏览器的头信息 例: 代码中添加头: header("Cache-Control: max-age=31536000"); header(" ...

  6. HTTP 错误 500（Internal Server Error）

    今天在用ajax请求页面的时候出现了这么一个错误:HTTP 错误 500(Internal Server Error) 由于提示较少,过了好一阵子才找到答案:ajax请求中调用了一个不存在的函数⊙﹏⊙ ...

  7. JAR包

    1,      使用JAR文件    jar文件的全称是Java Archive File,意思就是Java档案文件,通常jar文件是一种压缩文件,与常见的ZIP压缩文件兼容,通常也被称为jar包,j ...

  8. c++ 类模版、成员函数模版、函数模版 用法

    C++函数模版与类模版. template <class T> void SwapFunction(T &first, T &second){ }//函数模版 templa ...

  9. WP8_检测列表是否滑动

    One of the UI features of lists on Windows Phone 7 is that the "scroll bars" don't really ...

  10. angular directive指令的复用

    “指令之之所以要定义成指令就是为了复用!” 指令一定是可以用在不同的controller里面的,为了在不同的controller去使用它,我们一定要给指定的配置项一个指令.这样才能跟外面的控制器进行交 ...