diff --git a/examples/image-cross-domain-upload.html b/examples/image-cross-domain-upload.html
index 3c422885..4bbec3f6 100644
--- a/examples/image-cross-domain-upload.html
+++ b/examples/image-cross-domain-upload.html
@@ -91,7 +91,13 @@
图片跨域上传示例
imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
imageUploadURL : "http://www.ipandao.com/editor.md/examples/php/cross-domain-upload.php?test=dfdf",
crossDomainUpload : true,
- uploadCallbackURL : "http://localhost/editor.md/examples/php/upload_callback.html?test=dfdf"
+ uploadCallbackURL : "http://localhost/editor.md/examples/php/upload_callback.html?test=dfdf",
+ onload: function() {
+ // 引入插件 执行监听方法
+ editormd.loadPlugin("../plugins/image-handle-paste/image-handle-paste", function(){
+ testEditor.imagePaste();
+ });
+ }
/*
跨域时,上传的图片服务器后台只需要返回一个跳转 URL 并跳转到原页面同域下的 callback 页面,结构如下:
diff --git a/examples/image-upload.html b/examples/image-upload.html
index 69014cc7..39e37f82 100644
--- a/examples/image-upload.html
+++ b/examples/image-upload.html
@@ -51,8 +51,13 @@ 图片上传示例
//dialogMaskBgColor : "#000", // 设置透明遮罩层的背景颜色,全局通用,默认为 #fff
imageUpload : true,
imageFormats : ["jpg", "jpeg", "gif", "png", "bmp", "webp"],
- imageUploadURL : "./php/upload.php?test=dfdf",
-
+ imageUploadURL : "./php/upload.php",
+ onload: function() {
+ // 引入插件 执行监听方法
+ editormd.loadPlugin("../plugins/image-handle-paste/image-handle-paste", function(){
+ testEditor.imagePaste();
+ });
+ }
/*
上传的后台只需要返回一个 JSON 数据,结构如下:
{
diff --git a/plugins/image-handle-paste/image-handle-paste.js b/plugins/image-handle-paste/image-handle-paste.js
new file mode 100644
index 00000000..2f3a73b7
--- /dev/null
+++ b/plugins/image-handle-paste/image-handle-paste.js
@@ -0,0 +1,119 @@
+/*!
+ * editormd图片粘贴上传插件
+ *
+ * @file image-handle-paste.js
+ * @author zhangkaixing
+ * @modify stray_came
+ * @date 2020年5月29日
+ * @link https://www.codehui.net, https://boywithacoin.cn/
+ */
+
+(function() {
+
+ var factory = function (exports) {
+ var $ = jQuery; // if using module loader(Require.js/Sea.js).
+ var pluginName = "image-handle-paste"; // 定义插件名称
+
+ //图片粘贴上传方法
+ exports.fn.imagePaste = function() {
+ var _this = this;
+ var cm = _this.cm;
+ var settings = _this.settings;
+ var editor = _this.editor;
+ var classPrefix = _this.classPrefix;
+ var id = _this.id;
+
+ if(!settings.imageUpload || !settings.imageUploadURL){
+ console.log('你还未开启图片上传或者没有配置上传地址');
+ return false;
+ }
+
+ //监听粘贴板事件
+ $('#' + id).on('paste', function (e) {
+ var items = (e.clipboardData || e.originalEvent.clipboardData).items;
+ console.log(items[0], items[1])
+
+ //判断图片类型
+ if (items && (items[0].type.indexOf('image') > -1 || items[1].type.indexOf('image') > -1)) {
+ if (items[0].type.indexOf('image') > -1 ) {
+ var file = items[0].getAsFile();
+ } else {
+ var file = items[1].getAsFile();
+ }
+
+ /*生成blob
+ var blobImg = URL.createObjectURL(file);
+ */
+
+ /*base64
+ var reader = new FileReader();
+ reader.readAsDataURL(file);
+ reader.onload = function (e) {
+ var base64Img = e.target.result //图片的base64
+ }
+ */
+
+ // 创建FormData对象进行ajax上传
+ var forms = new FormData(document.forms[0]); //Filename
+ forms.append(classPrefix + "image-file", file, "file_"+Date.parse(new Date())+".png"); // 文件
+ console.log(classPrefix + "image-file", file, "file_"+Date.parse(new Date())+".png")
+ //调用imageDialog插件,弹出对话框
+ _this.executePlugin("imageDialog", "image-dialog/image-dialog");
+
+ _ajax(settings.imageUploadURL, forms, function(ret){
+ if(ret.success == 1){
+ //数据格式可以自定义,但需要把图片地址写入到该节点里面
+ $("." + classPrefix + "image-dialog").find("input[data-url]").val(ret.url);
+ // cm.replaceSelection("");
+ }
+ console.log(ret.message);
+ })
+ }
+ })
+ };
+ // ajax上传图片 可自行处理
+ var _ajax = function(url, data, callback) {
+ $.ajax({
+ "type": 'post',
+ "cache": false,
+ "url": url,
+ "data": data,
+ "processData": false,
+ "contentType": false,
+ "mimeType": "multipart/form-data",
+ success: function(ret){
+ callback(JSON.parse(ret));
+ },
+ error: function (err){
+ console.log('请求失败')
+ }
+ })
+ }
+ };
+
+ // CommonJS/Node.js
+ if (typeof require === "function" && typeof exports === "object" && typeof module === "object")
+ {
+ module.exports = factory;
+ }
+ else if (typeof define === "function") // AMD/CMD/Sea.js
+ {
+ if (define.amd) { // for Require.js
+
+ define(["editormd"], function(editormd) {
+ factory(editormd);
+ });
+
+ } else { // for Sea.js
+ define(function(require) {
+ var editormd = require("../../editormd");
+ factory(editormd);
+ });
+ }
+ }
+ else
+ {
+ factory(window.editormd);
+ }
+
+})();
\ No newline at end of file