源码下载请至:https://i847.cn/article/3032.html
以复制粘贴微信文章为例,效果如下图所示:
核心代码如下,在kindeditor创建时添加如下配置,其中上传图片接口请改成我们自己的接口:
afterCreate: function () { var editorObj = this; var doc = editorObj.edit.doc; $(doc.body).bind('paste', function (event) { var cbd = event.originalEvent.clipboardData; var ua = window.navigator.userAgent; if (cbd.items && cbd.items.length === 2 && cbd.items[0].kind === "string" && cbd.items[1].kind === "file" && cbd.types && cbd.types.length === 2 && cbd.types[0] === "text/plain" && cbd.types[1] === "Files" && ua.match(/Macintosh/i) && Number(ua.match(/Chrome\/(\d{2})/i)[1]) < 49) { //不处理 } else { for (var i = 0; i < cbd.items.length; i++) { var item = cbd.items[i]; if (item.kind == "file" && item.type.indexOf("image") > -1) { var blob = item.getAsFile(); if (blob.size > 0) { // 上传粘贴板中的截图到服务器 var form = document.imgForm; var formData = new FormData(form); formData.append("file", blob); var loading = layer.load(1, {shade: 0.3}); $.ajax({ type: "POST", url: editorObj.uploadMultiImgUrl, data: formData, dataType: "json", async: false, processData: false, contentType: false, success: function (res) { layer.close(loading); if (res.success) { var imgStr = '<img src="' + res.data.url + '" title="' + res.data.name + '" alt="' + res.data.name + '"/>'; editorObj.insertHtml(imgStr); } } }); } } } } setTimeout(function () { // 处理bug 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' }); } }); } $.each(imgs, function (index, item) { var _that = $(this); var imgSrc = decodeURIComponent(_that.attr("src")); if (imgSrc.indexOf("file://") > -1) {//用户本地图片 // 上传本地图片,暂无 compelete--; if (compelete === 0) { layer.close(layerindex); } } else if (imgSrc.indexOf("/pub/") === -1) {//根据uri简略判断是不是本网站的图片,请自行更改判断规则 // ajax异步上传其他网络图片,ajax写法请自从更改 $.postPayload(ctx + "/admin/attachment/uploadAttaForWebUrl", {url: imgSrc}, function (res) { compelete--; if (compelete === 0) { layer.close(layerindex); } if (res.success) { // 重置图片 _that.attr('src', res.data.url); _that.attr('data-ke-src', res.data.url); _that.attr('alt', res.data.name); } }) } else { // 本站网络图片不处理 compelete--; if (compelete === 0) { layer.close(layerindex); } } }); }, 0); }); },