第一步：下载编辑器

到官网下载 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. DDL(Oracle)

    DDL       数据定义       建表       建视图 建其他 drop create table t (a varchar2 (10));可变字符串最大为10 transaction - ...

  2. VS2013配置WTL90_4140_Final

    网上关于WTL的文章,尤其是中文的文章不多,根据收集的资料整理出了VS2013安装WTL的方法. 1.下载.文件很小的,地址:http://sourceforge.net/projects/wtl/f ...

  3. (转)log4net的配置详解

    原文地址:http://blog.csdn.net/pfe_nova/article/details/12225349 log4net是一款优秀的第三方日志框架,可以很容易的加载到开发项目中(引用lo ...

  4. android 隐藏系统键盘

    -----------------------------------------已验证----------------------------------- public static void c ...

  5. 怎样对CODESOFT中的条形码进行黑白转换

      CODESOFT 2015标签设计软件能 够提供无与伦比的灵活性.功能和支持,其面对的用户也是极其的广泛.对于一些需要打印黑白反转条形码的特殊用户,例如使用黑色标签纸的用 户,CODESOFT 2 ...

  6. rsync拉取远程文件

    mkdir -p   /doc sshpass -p ''pwd" rsync -avz -e 'ssh -o UserKnownHostsFile=/dev/null -o StrictH ...

  7. Oracle建立表空间和用户

    Oracle建立表空间和用户 建立表空间和用户的步骤: 用户 建立:create user 用户名 identified by "密码"; 授权:grant create sess ...

  8. 学习资料 经典SQL语句大全

    一.基础 1.说明:创建数据库CREATE DATABASE database-name 2.说明:删除数据库drop database dbname3.说明:备份sql server--- 创建 备 ...

  9. 学习总结 java基础

  10. java.lang.Exception: Socket bind failed: [730013] An attempt was made to acc

    在CMD命令行中启动运行startup.bat,启运程序总是闪退,查看日志发现如下错误: 26-Jan-2016 18:12:34.463 SEVERE [main] org.apache.coyot ...