百度 迷你版 UMeditor富文本编辑器 使用方法
2024-08-22 02:55:07
第一步:下载编辑器 到官网下载 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
最新文章
- ASP.NET Core 中文文档 第四章 MVC(01)ASP.NET Core MVC 概览
- shell 多行注释
- spring quartz 定时器时间格式设置
- 使用后缀数组寻找最长公共子字符串JavaScript版
- Part 33 Difference between abstract classes and interfaces
- hibernate中的SessionFactory,Session分别表示什么啊?如何理解?
- java学习笔记_GUI(1)
- Oracle EBS-SQL (MRP-5):重起MRP Manager.sql
- JIRA官方:JIRA报表与分析
- windows屏幕保护程序opengl模板
- asp.net core 系列 18 web服务器实现
- Github-记账本
- 向github提交代码不用输入帐号密码
- 机器人学 —— 机器人感知(Location)
- Faster rcnn代码理解(1)
- python安装mysql
- 使用Bootstrap 3开发响应式网站实践05,使用Tab、Modal、Form展示内容,使用Popover、Tooltip展示提示信息
- Android 界面间传参数
- freeswitch编译java esl
- java 泛型详解(转)