灵光网

下载网址：
https://ckeditor.com/cke4/addon/html5video

基本使用
<textarea id="editor1"></textarea>
<script>
  CKEDITOR.replace("editor1"）    
 </script>
获取和设置编辑区的内容

• 获取编辑器的实例：CKEDITOR.instances.editorId
• 获取：intance.getData()
• 设置：intance.setData('xxx')
• 如果编辑器的元素是textarea的话，可以通过intance.updateElement();editorId.value获取内容。

监听内容区变化

instance监听change事件

stance.on("change", function(evt) {
        // getData() returns CKEditor's HTML content.
        console.log("Total bytes: " + evt.editor.getData().length);
 });

config.removeDialogTabs = 'image:advanced;image:Link';//隐藏超连接与高级选项
config.extraPlugins = 'html5video,widget';
config.filebrowserHtml5videoUploadUrl= "/uploads?FileKind=2&FilePath=/pubres/videos";

ckeditor4要返回json格式如下：
{
"uploaded": 1,   //写死的
"fileName": filename,  //上传文件
"url": url  //上传服务器的图片的url
}

CKEDITOR 自定义图片上传
/** * 添加自定义图片上传组件 */
CKEDITOR.plugins.add('MultipleImageUpload',{//调用add方法添加插件
    init : function (editor) { //初始化页面时调用方法，接收一个富文本对象实例
        var pluginName = 'MultipleImageUpload'; //插件名
        var _file = document.getElementById('editFileInput'); //获取页面中的file文件选择器对象
        /** * 添加执行命令 */
        editor.addCommand('openFileComm', {//添加命令
            exec : function (editor) {//命令调用时执行此函数
                _file.click(); //触发文件选择器的点击事件
                _file.onchange = function(){//为文件选择器独享绑定onchange方法
                    console.log("_file is changed");
                    upload();//执行函数
                    function upload(){
                        var file = new FormData($("#editorImageForm")[0]);//获取文件表单中的文件对象
                        $.ajax({ //使用ajax请求上传图片
                            url : FILE_UPLOAD_URL + FILE_UPLOAD_URI,
                            type : 'POST',
                            data : file,
                            async : false,
                            cache : false,
                            contentType : false,
                            processData : false,
                            success : function(data) {
                                var element = CKEDITOR.dom.element.createFromHtml( '<img style="width: 100%;" src="'+ ACCESS_SERVER_URL + data.response[1] +'" border="0" />' );//上传成功后添加上传完成的图片元素到富文本内容中
                                editor.insertElement( element );//插入元素
                            },
                            error : function() {
                                alert("图片上传失败！");
                            }
                        });
                    }
                };
            },
            async : true
        });

        editor.ui.addButton && editor.ui.addButton(pluginName, { //添加一个上传图片的按钮
            label: '多图片上传',//按钮提示名
            command: 'openFileComm',//当按钮被点击时执行上面定义好的命令
            /** * 添加自定义按钮图片 */
            icon: this.path + 'images/hello_icon.png'
        });
    },

    /*onLoad : function(){ alert('onload'); console.log(this); }*/
});