当前仓库属于暂停状态,部分功能使用受限,详情请查阅 仓库状态说明
加入 Gitee
与超过 1200万 开发者一起发现、参与优秀开源项目,私有仓库也完全免费 :)
免费加入
该仓库未声明开源许可证文件(LICENSE),使用请关注具体项目描述及其代码上游依赖。
克隆/下载
贡献代码
同步代码
取消
提示: 由于 Git 不支持空文件夾,创建文件夹后会生成空的 .keep 文件
Loading...
README
官网 https://eleditor.fixel.cn


# 目录结构

    ├──── layout                        // 编辑器样式目录

    ├── webuploader.min.js                // WebUploader上传插件,当使用图片上传时需引入。

    ├── jquery.min.js                     // Eleditor依赖jQuery或者Zepto,必须引入才能工作

    ├── Eleditor.js                       // 开发版本
    ├── Eleditor.min.js                   // 压缩版本

    └── upload.json                       // 上传示例文件,可删除

# 调用示例

    <div id="articleEditor"></div>

    <script>
    var Edr = new Eleditor({
                el: '#articleEditor', //容器
                upload:{ //上传配置
                   server: '/upload.json', //上传路径
                   compress: true, //上传前是否压缩图片
                   fileSizeLimit: 2 //限制图片上传大小,单位M
                },
        });

    //请记住下面常用方法---------------------------------------->
    //Edr.append( str ); 往编辑器追加内容
    //Edr.getContent(); 获取编辑器内容
    //Edr.getContentText(); 获取编辑器纯文本
    //Edr.destory(); 移除编辑器
    </script>

# 扩展示例
    <div id="articleEditor"></div>

    <script>
    var Ed = new Eleditor({
      el: '#contentEditor',
            upload:{
              server: '/upload.json',
              compress: false,
              fileSizeLimit: 2
            },
            toolbars: [
              'insertText',
              'editText',
              'insertImage',
              'insertLink',
              'deleteBefore',
              'deleteAfter',
              'insertHr',
              'deleteThis',

              //自定义一个按钮
              {
                  id: 'changeIndent',
                  tag: 'P', //指定P标签操作,可不填
                  name: '缩进',
                  handle: function(select, controll)
              },

              //自定义按钮,该按钮只有在编辑IMG标签时才会显示
              {
                  id: 'rotateImage',
                  tag: 'IMG', //指定IMG标签操作,可不填
                  name: '反转图片',
                  handle: function(select, controll){
                    var _$ele = $(select),
                      _$controll = $(controll);
                    if( _$ele.attr('transform-rotate') != '180deg' ){
                      _$controll.html('还原图片');
                        _$ele.attr('transform-rotate', '180deg').css('transform', 'rotate(180deg)');
                    }else{
                      _$controll.html('反转图片');
                      _$ele.removeAttr('transform-rotate').css('transform', 'rotate(0)');
                    }
                  }
              },

              'cancel',
            ]
    });
    </script>

空文件

简介

由于移动设备的交互方式,传统的PC富文本编辑器在移动手机、平板上面无法达到良好的操作体验,Eleditor(element editor)顾名思义,旨在对html元素进行操作编辑,实现了唯一开源的真正所见即所得的移动端富文本编辑器 Eleditor可以用于移动端具有跨平台文档编辑或共享的场景,例如文章发布等,我们在保证用户体验情况下实现更全面的移动富文本编辑方案 目前版本涵盖了日常常用的编辑操作,如文本编辑、样式、添加,图片上传、超链接等实用操作,开发者也可以自行扩展操作按钮来实现更多功能 展开 收起
JavaScript
取消

发行版

暂无发行版

贡献者

全部

近期动态

加载更多
不能加载更多了
马建仓 AI 助手
尝试更多
代码解读
代码找茬
代码优化