[转] http://fex.baidu.com/ueditor/

UEditor 介绍

UEditor 是由百度「FEX前端研发团队」开发的所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码。

1 入门部署和体验

1.1 下载编辑器

到官网下载 UEditor 最新版:[官网地址]

1.2 创建demo文件

解压下载的包,在解压后的目录创建 demo.html 文件,填入下面的html代码

<!DOCTYPE HTML>
<html lang="en-US"> <head>
<meta charset="UTF-8">
<title>ueditor demo</title>
</head> <body>
<!-- 加载编辑器的容器 -->
<script id="container" name="content" type="text/plain">
这里写你的初始化内容
</script>
<!-- 配置文件 -->
<script type="text/javascript" src="ueditor.config.js"></script>
<!-- 编辑器源码文件 -->
<script type="text/javascript" src="ueditor.all.js"></script>
<!-- 实例化编辑器 -->
<script type="text/javascript">
var ue = UE.getEditor('container');
</script>
</body> </html>

1.3 在浏览器打开demo.html

如果看到了下面这样的编辑器,恭喜你,初次部署成功!

1.4 传入自定义的参数

编辑器有很多可自定义的参数项,在实例化的时候可以传入给编辑器:

var ue = UE.getEditor('container', {
autoHeight: false
});

配置项也可以通过 ueditor.config.js 文件修改,具体的配置方法请看前端配置项说明

1.5 设置和读取编辑器的内容

通 getContent 和 setContent 方法可以设置和读取编辑器的内容

var ue = UE.getContent();
//对编辑器的操作最好在编辑器ready之后再做
ue.ready(function() {
//设置编辑器的内容
ue.setContent('hello');
//获取html内容,返回: <p>hello</p>
var html = ue.getContent();
//获取纯文本内容,返回: hello
var txt = ue.getContentTxt();
});
 

UEditor富文本编辑器的使用 http://fex.baidu.com/ueditor/的更多相关文章

  1. UEditor富文本编辑器简单使用

    UEditor富文本编辑器简单使用 一.下载地址:https://ueditor.baidu.com/website/ 官网中并没有 python 版本的 UEditor 富文本编辑器,本文简单介绍 ...

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

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

  3. MVC 使用 Ueditor富文本编辑器

    一.Ueditor 1.下载Ueditor富文本编辑器 官方下载地址: http://ueditor.baidu.com/website/download.html 建议下载开发版,此处我下载的是 . ...

  4. 百度ueditor富文本编辑器的使用

    百度ueditor富文本编辑器的使用 //以下为我在官网下载的ueditor v1.3.5 php版的大楷配置步骤第一步: //配置文件的引入应该比功能文件先引入,最后设置语言类型.即:editor. ...

  5. 前后端分离ueditor富文本编辑器的使用-Java版本

    最近在写一个自己的后台管理系统(主要是写着玩的,用来熟悉后端java的知识,目前只是会简单的写点接口),想在项目中编写一个发布新闻文章的功能,想到了使用百度的ueditor富文本编辑器,网上找了很多j ...

  6. ASP.NET MVC5 中百度ueditor富文本编辑器的使用

    随着网站信息发布内容越来越多,越来越重视美观,富文本编辑就是不可缺少的了,众多编辑器比较后我选了百度的ueditor富文本编辑器. 百度ueditor富文本编辑器分为两种一种是完全版的ueditor, ...

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

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

  8. ueditor富文本编辑器使用百度地图自定义动态地图组件及兼容https及http协议

    ueditor富文本编辑器默认支持百度地图组件,但是如果导入动态地图后会加很多默认的地图组件在上面.如果需要自定义动态地图的组件则需要修改ueditor特定的html. ueditor百度地图组件所在 ...

  9. WEB项目中使用UEditor(富文本编辑器)

    Ueditor富文本编辑器是在很多项目里经常用到的框架,是百度开发团队开发的一款很好用的富文本编辑器 下面就是我在一个系统里用到的,有了富文本编辑器,管理员使用起来不是很方便? 所以本博客介绍这个富文 ...

随机推荐

  1. nodejs模块Phantom,无界面浏览器

    PhantomJS 是一个无界面的 webkit 内核浏览器,

  2. 使用Java实现八种基本排序

    插入排序.选择排序.冒泡排序.希尔排序.堆排序.快速排序.归并排序.基数排序 import java.util.ArrayList; import java.util.List; /** * 排序算法 ...

  3. [转载]Runtime详解

      Runtime的特性主要是消息(方法)传递,如果消息(方法)在对象中找不到,就进行转发,具体怎么实现的呢.我们从下面几个方面探寻Runtime的实现机制. Runtime介绍 Runtime消息传 ...

  4. INSPIRED启示录 读书笔记 - 第9章 产品副经理

    发现帮手 从本质上讲,产品就是创意,产品经理的职责是想出好点并加以实现.我们需要好点子,有些想法是我们自己的创意,但如果仅依靠自己,就会严重限制创意的发挥 做产品要找公司最聪明的人合作,发现公司里潜在 ...

  5. poj 1961 Period 【KMP-next前缀数组的应用】

    题目地址:http://poj.org/problem?id=1961 Sample Input 3 aaa 12 aabaabaabaab 0 Sample Output Test case #1 ...

  6. 向maven依赖包中添加新的jar包

    今天做一个项目测试的时候正好遇到这个问题,查了网上的资料,有两篇写的挺好,两种方法都试了,都可以. 1.个人觉得第一种简单:http://www.360doc.com/content/14/0517/ ...

  7. 【P1886】滑动窗口(单调队列→线段树→LCT)

    这个题很友好,我们可以分别进行简单难度,中等难度,恶心难度来做.然而智商没问题的话肯定是用单调队列来做... 板子题,直接裸的单调队列就能过. #include<iostream> #in ...

  8. Oracle数据库类型总结

    RACLE基本数据类型(亦叫内置数据类型 built-in datatypes)可以按类型分为:字符串类型.数字类型.日期类型.LOB类型.LONG RAW& RAW类型.ROWID & ...

  9. CentOS 7(64位) 下Docker的安装

    系统要求是64位,内核版本至少3.10. 首先添加yum软件源: 之后更新yum软件源缓存,并安装docker-engine 查看docker 版本: Cannot connect to the Do ...

  10. JavaWeb -- 文件上传下载示例

    1. 上传简单示例 Jsp <%@ page language="java" import="java.util.*" pageEncoding=&quo ...