WUI v1.1.0

基础说明

开始使用 Getting Started
底层方法 基础支撑
页面元素 规范 / 公共类
模块规范 使用 / 扩展
常见问题 FAQ
更新日志

页面元素

布局 容器 / 栅格 / 后台布局
颜色 主题色 / 内置背景色
图标 字体图标
动画 内置 CSS3 动画
按钮 button 组
表单 form 元素集合
导航 菜单 / 面包屑
选项卡 Tabs 切换
进度条 progress
面板 折叠 / 手风琴
表格 静态 table
徽章 小圆点 / 小边框
时间线 timeline
区块 引用 / 字段集
文字 颜色 / 链接 / 位置
辅助 边距 / 填充 / 横线等

内置模块

弹出层 layer
日期与时间选择 wdate
分页 wpage
模板引擎 wtpl
数据表格 table
表单 form
文件上传 upload
穿梭框 transfer
树形组件 tree
颜色选择器 colorpicker
常用元素操作 element
滑块 slider
评分 rate
轮播 carousel
流加载 flow
工具集 util
简单编辑器 wedit
富文本编辑器 tinymce
下拉菜单 menu
拖动排序 dragsort
自动完成 autocomplete
代码修饰器 code
通知控件 notice
下拉多选控件 xmSelect
滑块验证 sliderVerify
无限级联选择器 cascader
富文本编辑器 - wui.tinymce 查阅 tinyMCE 文档

为了给大家提供更加实用强大的富文本编辑器,我们深度整合了当前市面上比较有名的 tinymce 编辑器(版本号v5.6.2),可以和 wui 一起按 wui 的方式进行常规调用,当然也可以当成独立组件来使用。
模块加载名称:tinymce

跟大部分编辑器一样,你需要放置一个标签(一般为 textarea 文本域)作为编辑器的目标元素,然后调用 tinymce.render(...) 即可,如下所示:


<textarea id="edit">Hello, World!</textarea>

<script type="text/javascript">
    wui.use('tinymce', function(){
        var tinymce = wui.tinymce;

        var edit = tinymce.render({
            elem: "#edit"
        });

    });
</script>
我们选用 tinyMCE v5.6.2 版本进行整合,因为进行了诸多二次开发,tinyMCE 官方文档对于二次开发过的部分已经不再适用,为止我们对相关文档进行了归档,以方便大家随时查阅,后续随着 tinyMCE 官方和 Wangren 系统持续升级,我们也会持续进行升级和发布。

查阅 tinyMCE 文档
© 2021 Wangren.Net  Layui  tinyMCE  SUI Mobile