tinymce编辑器+layui

tinymce功能很强大的一款编辑器

源码以及参考资料：https://gitee.com/chick1993/layui-tinymce

代码如下 html:

                        <div >
                        	<textarea id="edit"></textarea>
                        </div>

Js（上传图片注意修改为自己的地址）

var content = "";
var edit = "";    
layui.extend({
        tinymce: '{/}./存放路径'
    }).use(['tinymce'], function () {
    	var t = layui.tinymce;
        t.render({
            elem: "#edit",
            height: 600,
            //images_upload_url:"/自己的上传地址"//二进制
            //重写上传方法(带进度条)，不然传的二进制，以下返回的结果格式：{ location : "/demo/image/1.jpg" }
            images_upload_handler: function (blobInfo, success, failure, progress) {
                    var xhr, formData;
                    xhr = new XMLHttpRequest();
                    xhr.withCredentials = false;
                    xhr.open('POST', '/自己的上传地址');

                    xhr.upload.onprogress = function(e){
                        progress(e.loaded / e.total * 100);
                    }

                    xhr.onload = function() {
                        var json;
                        if (xhr.status == 403) {
                            failure('HTTP Error: ' + xhr.status, { remove: true });
                            return;
                        }
                        if (xhr.status < 200 || xhr.status >= 300 ) {
                            failure('HTTP Error: ' + xhr.status);
                            return;
                        }
                        json = JSON.parse(xhr.responseText);
                        if (!json || typeof json.location != 'string') {
                            failure('Invalid JSON: ' + xhr.responseText);
                            return;
                        }
                        success(json.location);
                    };

                    xhr.onerror = function () {
                        failure('Image upload failed due to a XHR Transport error. Code: ' + xhr.status);
                    }

                    formData = new FormData();
                    formData.append('file', blobInfo.blob(), blobInfo.filename());
                    
                    xhr.send(formData);
                }
            	
            	
        },(opt, d)=>{
            // 加载完成后回调 opt 是传入的所有参数
            // edit是当前编辑器实例，等同于t.get返回值
        	edit = d;
        	d.setContent(content);//回显
        	
        });
       
    })

上传注意返回结果格式：

{ location : "/demo/image/1.jpg" }

取值

var ftext = edit.getContent();//获得富文本内容