kindeditor 富文本粘贴时自动同步上传图片，自动替换图片地址

kindeditor 富文本粘贴时自动同步上传图片，自动将第三方图片地址替换成我们自己的

1.我的的页面模块内容

<tr>
    <td class="tdl">内容详情：</td>
    <td class="tdr">
        <textarea id="content" name="content" class="input-long" style="width: 800px; height:500px;"></textarea>
    </td>
</tr>

2.js初始化加载

//富文本编辑框初始化
KindEditor.ready(function (K) {
    window.editorDescribtion = K.create('#content', {
        cssPath: '/kindeditor/plugins/code/prettify.css',
        uploadJson: '/upload/upload_json',//这里是当个图片手动上传接口地址
        fileManagerJson: '/file/file_manager_json',
        allowFileManager: true,
        filterMode:false,
        afterCreate: function () {
            var self = this;
            K.ctrl(document, 13, function () {
                self.sync();
                document.forms['example'].submit();
            });
            K.ctrl(self.edit.doc, 13, function () {
                self.sync();
                document.forms['example'].submit();
            });
            //复制粘贴内容，触发抓包事件
            var editorObj = this;
            //得到编辑器的文档对象
            var doc = editorObj.edit.doc;
            $(doc.body).bind('paste', function (event) {
                setTimeout(function () {
                    var useless = $(doc.body).find(".__kindeditor_paste__");
                    if (useless) {
                        useless.removeAttr("style");
                        useless.removeClass("__kindeditor_paste__");
                    }
                    var imgs = $(doc.body).find("img");
                    var compelete = imgs.length;
                    var layerindex;
                    if (compelete > 0) {
                        // 转存时加载弹出层，这里用的是layer
                        layerindex = layer.load(1, {
                            shade: [0.3, '#fff'],
                            content: '网络图片转存中...',
                            success: function (layero) {
                                layero.find('.layui-layer-content').css({
                                    'padding-top': '39px',
                                    'width': '120px',
                                    'margin-left': '-60px'
                                });
                            },
                            icon: 6, time:3000
                        });
                    }
                    $.each(imgs, function (index, item) {
                        var _that = $(this);
                        var imgSrc = decodeURIComponent(_that.attr("src"));
                        if (imgSrc.indexOf("superzhuangplus") > -1) {
                            //已经上传到plus服务器的图片无需再次上传
                            compelete--;
                            if (compelete === 0) {
                                layer.close(layerindex);
                            }
                        } else{
                        	//上传图片接口
                            $.ajax({
                                url: "/upload/editorFileupload",
                                data: "imgUrl=" + imgSrc,
                                type: "POST",
                                dataType: "json",
                                success: function (data) {
                                    if (data != null && data.code == 200 && data.data != null) {
                                    	//上传成功之后，将图片访问地址替换成我们自己的
                                        _that.attr("src",data.data.filePath);
                                        _that.attr("data-ke-src",data.data.filePath);
                                    }
                                }
                            });
                        }
                    });
                }, 0);
            });
        },

    });
    prettyPrint();
});

3.我们粘贴一片很长的文章到富文本中(文章中有很多图片或gif)

4.文章上传过程中我们要等一会，因为图片上传成功之后，还需要将文章中第三方图片地址替换成我们自己的图片地址

5.体验地址：https://www.i847.cn/kindeditor-plus/index.html