地区 ：[ 切换城市 ]       新闻 娱乐 企业 博客 视频 工具 网站建设 开发者 旅行 社区
商品分类 | 联系客户
租房
招聘
本地
汽车
二手
宝贝
高级
设置
   搜索排行： 最新租房 最新职位 网络推广 销售急聘 我要搬家 无忧装修 流量红包 微店 运动套装 打底裤 蚊帐 更多

手机生活网

生活网 > 本站新闻 > 新闻分类 > KindEditor粘贴时候自动上传远程图片（非本地）

KindEditor粘贴时候自动上传远程图片（非本地）

  • 2018-03-05 11:03:21 发布
  • 浏览：8728 次
  • 近一个月发布3条帖子
KindEditor粘贴时候自动上传远程图片（非本地）
市微信朋友圈广告开户，广告制作，广告投放。
9级金牌商家

超过98%同行

会员2年 营业执照认证
服务支持
先行赔付
35个月
加入生活网
347个
发布帖子
2000元
保障金
  • 人气 3.0 ↑
  • 活跃 3.0 ↑
  • 服务 3.9 -
进入店铺 商家动态 信用档案 进入官网

温馨提示：1、在办理服务前请确认对方资质, 夸大的宣传和承诺不要轻信！2.任何要求预付定金、汇款至个人银行账户等方式均存在风险，谨防上当受骗！

详情描述 创业指南 查看电话号码

设施服务

更多参数
是否上门
上门服务

服务描述

KindEditor版本：4.1.10 (2013-11-23)，具体可以去官网下载：http://kindeditor.net/down.php

基本的配置这里不说了，官网有文档，贴代码：

[html] view plain copy
  1. <textarea id="content" style="width:80%;height:100px;">textarea>  
[javascript] view plain copy
  1. //定义编辑器对象  
  2. var editor;  
  3.   
  4. //异步加载编辑器  
  5. $.getScript('../kindeditor/kindeditor-min.js', function () {  
  6.     KindEditor.basePath = '../kindeditor/';  
  7.     editor = KindEditor.create('textarea[id="content"]', {  
  8.             id : 'editor_id',  
  9.             uploadJson : '../kindeditor/asp.net/upload_json.ashx',  
  10.             fileManagerJson : '../kindeditor/asp.net/file_manager_json.ashx',  
  11.             allowFileManager : true, //默认false  
  12.             resizeType : 1,  
  13.             items : [  
  14.                 'undo', 'redo', '|',  
  15.                 'fontname', 'fontsize', '|',  
  16.                 'forecolor', 'hilitecolor', 'bold', 'italic', 'underline', 'removeformat', '|',  
  17.                 'justifyleft', 'justifycenter', 'justifyright', 'insertorderedlist', 'insertunorderedlist', '|',  
  18.                 'image', 'link', '|', 'preview'],  
  19.             autoHeightMode : true, //默认值: false  
  20.             afterCreate : function () {  
  21.                 this.loadPlugin('autoheight');  
  22.   
  23.                 var __doc = this.edit.doc;  
  24.                 //KindEditor.ctrl(__doc, 'V', function () {  
  25.                 //    alert('123');  
  26.                 //});  
  27.                 $(__doc).bind('paste', null, function () { //右键粘贴, 包括 ctrl+v  
  28.                     setTimeout(function () {  
  29.                         parent.uploadWebImg(editor);  
  30.                     }, 200);  
  31.                 });  
  32.             },  
  33.             afterChange : function () {  
  34.                 $('.word_count').html(this.count()); //（字数统计包含HTML代码。）  
  35.             },  
  36.         });  
  37. });  
这里注意，要修改下kindeditor-min.js这个文件中的一个地方，不然粘贴的文本在事件响应之后（表现就是没有内容粘贴到编辑器中）

通过源代码可以在这里看到：https://github.com/kindsoft/kindeditor/blob/master/kindeditor-all.js

影响的具体方法就看自己这么写了，我的uploadWebImg代码贴到下面，用的layer弹窗组件，具体看它的官网api，这里不多说。

[javascript] view plain copy
  1. //上传远程图片  
  2. function uploadWebImg(editor) {  
  3.     var relaceSrc = []; //图片地址对象容器  
  4.     var imgs = $(editor.html()).find('img');  
  5.   
  6.     imgs.map(function () {  
  7.         var _src = $(this).attr('src');  
  8.         //if ((_src.indexOf('http://') >= 0 || _src.indexOf('https://') >= 0) && checkimgok(_src)) {  
  9.         if (_src.indexOf('http://') >= 0 || _src.indexOf('https://') >= 0) { //考虑可能有动态生成的图片  
  10.             relaceSrc.push({ k: _src });  
  11.         };  
  12.     });  
  13.   
  14.     if (relaceSrc.length == 0) return;  
  15.   
  16.     var msg = '内容包含' + relaceSrc.length.toString() + '张远程图片，是否现在上传？';  
  17.   
  18.     confirmLayerNormal(msg, function (_index) {  
  19.         var loading = layer.load(0);  
  20.         var paramdata = {  
  21.             action: "791c252eee12530f4f3af326674b7d97",  
  22.             arg: { imgs: relaceSrc },  
  23.         };  
  24.   
  25.         doAjaxPost(paramdata, function (result) {  
  26.             layer.close(loading);  
  27.             if (!result.success) {  
  28.                 SuperSite.MsgError(result.msg);  
  29.                 return;  
  30.             }  
  31.   
  32.             //替换编辑器图片源  
  33.             var _content = editor.html();  
  34.             $(relaceSrc).each(function (idx, dom) {  
  35.                 _content = _content.replace(dom.k, result.data[idx].value);  
  36.             });  
  37.             editor.html(_content);  
  38.   
  39.             SuperSite.MsgOK('远程图片上传成功');  
  40.         });  
  41.         layer.close(_index);  
  42.     });  
  43. };  

服务端的代码：
[csharp] view plain copy
  1. ///   
  2. /// 上传远程图片  
  3. ///   
  4. private void UploadWebImg()  
  5. {  
  6.     var ajaxdata = base.GetActionParamData();  
  7.     if (ajaxdata == null || ajaxdata.imgs == null || ajaxdata.imgs.Count == 0)  
  8.         Outmsg(false, outmsg: "未获取到上传的图片地址");  
  9.   
  10.     var len = ajaxdata.imgs.Count;  
  11.     var tempurl = new List();  
  12.     var stkimg = new Stack(len); //上传栈列  
  13.   
  14.     for (int i = 0; i < len; i++)  
  15.     {  
  16.         var img = ajaxdata.imgs[i].k.Trim();  
  17.   
  18.         if (stkimg.Any(x => x.value == img))  //刚刚上传过了（说明有重复的图片要上传）  
  19.         {  
  20.             var loadedpath = stkimg.First(x => x.value == img).value;  
  21.             tempurl.Add(new KeyValueDesc  
  22.             {  
  23.                 key = i.ToString(),  
  24.                 value = loadedpath,  
  25.                 desc = (int)EnumCenter.UploadImgStatus.Repeat  
  26.             });  
  27.             continue;  
  28.         }  
  29.   
  30.         var tb = DownLoadWebImg(img);  
  31.         stkimg.Push(new KeyValue { key = i.ToString(), value = tb.Item2 }); //推入栈  
  32.         tempurl.Add(new KeyValueDesc  
  33.         {  
  34.             key = i.ToString(),  
  35.             value = tb.Item2,  
  36.             desc = tb.Item1 ?  
  37.             (int)EnumCenter.UploadImgStatus.OK :  
  38.             (int)EnumCenter.UploadImgStatus.Error  
  39.         });  
  40.     }  
  41.   
  42.     Outmsg(true, outdata: tempurl);  
  43. }  
  44. private Tuple<bool, string> DownLoadWebImg(string url)  
  45. {  
  46.     try  
  47.     {  
  48.         var dt = DateTime.Now;  
  49.         var folder = "/upload/image/" + dt.ToString("yyyyMMdd", DateTimeFormatInfo.InvariantInfo) + "/";  
  50.         var newfile = dt.ToString("HHmmss_ffff", DateTimeFormatInfo.InvariantInfo)   
  51.                     + url.Substring(url.LastIndexOf('.')); //扩展名（带.号）  
  52.         var filepath = Server.MapPath(folder);  
  53.   
  54.         if (!Directory.Exists(filepath))  
  55.         {  
  56.             Directory.CreateDirectory(filepath);  
  57.         }  
  58.   
  59.         using (WebClient mywebclient = new WebClient())  
  60.         {  
  61.             mywebclient.DownloadFile(url, filepath + newfile);  
  62.             return new Tuple<bool, string>(true, folder + newfile);  
  63.         }  
  64.     }  
  65.     catch (Exception ex)  
  66.     {  
  67.         Tools.LogHelp.WriteLog("下载远程图片失败", ex);  
  68.         return new Tuple<bool, string>(false, url); //返回原图地址  
  69.     }  
  70. }  


联系我时，请说是在 看到的，谢谢！


查看更多
查看更多

店铺信息

筛选
深圳
全部区域
© 2018 Baidu - GS(2016)2089号 - 甲测资字1100930 - 京ICP证030173号 - Data © 创梦科技

服务一条龙

猜你喜欢

    您好！没有信息，请您浏览其它内容。
淘宝装修微商城手机网站中英文域名域名注册在线留言
热门推荐：
微信小程序开发 680元起 专业全行业推广 虚拟币交易系统开发公司 APP系统开发 十秒竞拍 网站建设 转让融资租赁、融资担保、资产基金互联网金融牌照公司 私募备案 金融 前海金融公司转让 合法催收 360推广 小程序定制开发和运营服务 搜狗，搜狗推广，推广开户搜狗代理商上门服务

您可能感兴趣

    		•

    您好！没有信息，请您浏览其它内容。
其他人还浏览
    您好！没有信息，请您浏览其它内容。