• kindeditor 富文本粘贴 图片


     1 <script type="text/javascript" src="../../Scripts/Plugins/kindeditor/kindeditor.js"></script>
     2     <script type="text/javascript">
     3 
     4         var editor;
     5         KindEditor.ready(function (K) {
     6             editor = K.create('#Comment', {
     7                 uploadJson: '../../Scripts/Plugins/kindeditor/asp.net/upload_json.ashx',
     8                 fileManagerJson: '../../Scripts/Plugins/kindeditor/asp.net/file_manager_json.ashx',
     9                 afterBlur: function () { this.sync(); },
    10                 items: [
    11                     'source', '|',  'print', 'template', 'cut', 'copy', 'paste',
    12                     'plainpaste', 'wordpaste', '|', 'justifyleft', 'justifycenter', 'justifyright',
    13                     'superscript', 'clearhtml', 'quickformat',
    14                     'formatblock', 'fontname', 'fontsize', '|', 'forecolor', 'hilitecolor', 'bold',
    15                     'italic', 'underline', 'strikethrough', 'lineheight', 'removeformat', '|', 'image', 'multiimage',
    16                     'flash'
    17                 ],
    18                 afterCreate: function () {
    19                     var editerDoc = this.edit.doc;//得到编辑器的文档对象
    20                     //监听粘贴事件, 包括右键粘贴和ctrl+v
    21                     $(editerDoc).bind('paste', null, function (e) {
    22                         /*获得操作系统剪切板里的项目,e即kindeditor,
    23                         *kindeditor创建了originalEvent(源事件)对象,
    24                         *并指向了浏览器的事件对象,而chrome浏览器
    25                         *需要通过clipboardData(剪贴板数据)对象的items
    26                         *获得复制的图片数据。
    27                         */
    28                         var ele = e.originalEvent.clipboardData.items;
    29                         for (var i = 0; i < ele.length; ++i) {
    30                             //判断文件类型
    31                             if (ele[i].kind == 'file' && ele[i].type.indexOf('image/') !== -1) {
    32                                 var file = ele[i].getAsFile();//得到二进制数据
    33                                 //创建表单对象,建立name=value的表单数据。
    34                                 var formData = new FormData();
    35                                 formData.append("Filedata", file);//name,value
    36 
    37                                 //用jquery Ajax 上传二进制数据
    38                                 $.ajax({
    39                                     url: '../../Services/UploadFile.ashx?action=1',
    40                                     type: 'POST',
    41                                     data: formData,
    42                                     // 告诉jQuery不要去处理发送的数据
    43                                     processData: false,
    44                                     // 告诉jQuery不要去设置Content-Type请求头
    45                                     contentType: false,
    46                                     dataType: "json",
    47                                     beforeSend: function () {
    48                                         //console.log("正在进行,请稍候");
    49                                     },
    50                                     success: function (responseStr) {
    51                                         //上传完之后,生成图片标签回显图片,假定服务器返回url。
    52                                         var src = responseStr.LnkUrl;
    53                                         var imgTag = "<img src='" + src + "' border='0'/>";
    54 
    55                                         //console.info(imgTag);
    56                                         //kindeditor提供了一个在焦点位置插入HTML的函数,调用此函数即可。
    57                                         editor.insertHtml(imgTag);
    58 
    59 
    60                                     },
    61                                     error: function (responseStr) {
    62                                         console.log("error");
    63                                     }
    64                                 });
    65 
    66                             }
    67 
    68                         }
    69                     }
    70                     )
    71                 }
    72             });
    73         });

    </script>

     富文本框实现粘贴图片

  • 相关阅读:
    STL的相关知识
    有关欧拉通路/回路的一些资料整理
    差分约束
    BZOJ 2100: [Usaco2010 Dec]Apple Delivery
    BZOJ 2017: [Usaco2009 Nov]硬币游戏(A Coin Game)
    vijos 1282&1283&1284&1285 佳佳的魔法照片/魔法药水/魔杖/魔法阵
    BZOJ 1660: [Usaco2006 Nov]Bad Hair Day
    BZOJ 1602: [Usaco2008 Oct]牧场行走
    BZOJ 1647: [Usaco2007 Open]Fliptile 翻格子游戏
    BZOJ 1646: [Usaco2007 Open]Catch That Cow
  • 原文地址:https://www.cnblogs.com/maja/p/10276596.html
Copyright © 2020-2023  润新知