easyEditor编辑器支持插入表情

所属分类:输入-丰富的输入

 1533  12  查看评论 (2)
easyEditor编辑器支持插入表情 ie兼容9

更新时间:2017/12/25 下午2:20:05

更新说明:支持IE9,修改了md文档的描述,新增placeholder功能


easyEditor

首先你需要引入css与JS

<link rel="stylesheet" href="css/easyEditor.css" />
<script src="js/easyEditor.js"></script>

html你只需要一个div

<div id="editor" style="width:500px;height:300px;"></div>

我们需要实例化

var editor = new EasyEditor('editor');

插入表情

/**
 * @desc 插入表情方法
 * @param {object} opt 
 * @param {string} opt.src 表情路径 
 * @param {string} opt.remark 表情说明
 * @param {function} opt.afterInsert 插入后的回调函数
 *
 */
editor.insertEmoji({
    src: 'emoji/1.gif',
    remark: '笑脸',
    afterInsert: function() {
        //do something
    }
});

插入行块

/**
 * @desc 插入行块方法
 * @param {object} opt
 * @param {string} opt.text 文字 
 * @param {string} opt.color 文字颜色
 * @param {function} opt.afterInsert 插入后的回调函数
 *
 */

editor.insertBlock({
    text: '@somebody',
    color: '#f00',
    afterInsert: function() {
        //do something
    }
});

获取编辑器里面的html

var myhtml = editor.getContent(false);

获取编辑器里面的text

var mytext = editor.getContent(true);

属性

editor.sel; // selection 对象
editor.ran; // range 对象
editor.obj; // 编辑器对象(即文中id为editor的div);
相关插件-丰富的输入

jQuery在线做试卷并查看答案

jQuery在线试卷,提交后查看答案、解析。题型包括 1单选2多选3判断4填空5问答8论述题6完型填空7阅读理解
  丰富的输入
 3307  24

电子签章电子签名

H5画板实现电子签名可生成图片,代码简单注释全
  丰富的输入
 5241  79

Javascript模拟键盘事件

Javascript模拟键盘事件 可对应键盘每一个键
  丰富的输入
 5552  32

[力荐]表情选择器

完全自定义的表情选择器。
  丰富的输入
 33830  167

讨论这个项目(2)回答他人问题或分享插件使用方法奖励jQ币

    Lz7 0
    2017/12/26 9:00:39
    editor.placeholder(string);可插入placeholder功能我的git,欢迎交流https://github.com/lz7git/easyEditor 回复
    三月Kitty 0
    2017/12/25 14:07:25
取消回复