出于兴趣爱好,前段时间自己尝试写了一个叫simple的cms,里面使用了百度ueditor编辑器,发现它的多图片上传模块很不错,用起来很方便,又可以选择已经上传好的图片。正好我又是个懒人,发现有现成的自己就不想新开发了。于是我就想,是不是可以调用这个上传模板为自己所用呢?

有了这个想法后,我就到网上查阅资料,可惜资料少的可怜,都不能很好解决我的问题。于是觉得还是自己动手丰衣足食,皇天不负苦心人,终于摸索出解决方法,现在分享出来,和自己有同样想法的小伙伴。

代码如下:

<html>
<head>
<script src="ueditor/ueditor1.43.config.js"></script>
<script src="ueditor/ueditor1.43.all.min.js"></script>
</head>
<body> <script type="text/plain" id="j_ueditorupload" style="height:5px;display:none;" ></script>
<script>
//实例化编辑器
var o_ueditorupload = UE.getEditor('j_ueditorupload',
{
autoHeightEnabled:false
});
o_ueditorupload.ready(function ()
{ o_ueditorupload.hide();//隐藏编辑器 //监听图片上传
o_ueditorupload.addListener('beforeInsertImage', function (t,arg)
{
alert('这是图片地址:'+arg[0].src);
}); /* 文件上传监听
* 需要在ueditor.all.min.js文件中找到
* d.execCommand("insertHtml",l)
* 之后插入d.fireEvent('afterUpfile',b)
*/
o_ueditorupload.addListener('afterUpfile', function (t, arg)
{
alert('这是文件地址:'+arg[0].url);
});
}); //弹出图片上传的对话框
function upImage()
{
var myImage = o_ueditorupload.getDialog("insertimage");
myImage.open();
}
//弹出文件上传的对话框
function upFiles()
{
var myFiles = o_ueditorupload.getDialog("attachment");
myFiles.open();
}
</script> <button type="button" onClick="upImage()">调用上传图片模块</button>
<br>
<button type="button" onClick="upFiles()">调用上传文件模块</button> </body>
<html>

注意:需要在ueditor.all.min.js文件中找到d.execCommand("insertHtml",l)之后插入d.fireEvent('afterUpfile',b)

教你如何调用百度编辑器ueditor的上传图片、上传文件等模块的更多相关文章

  1. dedecmsV5.7 百度编辑器ueditor 多图上传 在线管理 排序问题

    问题:dedecms后台百度编辑器ueditor的多图上传-在线管理的图片排序有问题,想把这个顺序调成按照文件修改时间倒序来展示 解决方法: 1.打开/include/ueditor/php/acit ...

  2. 百度编辑器ueditor批量上传图片或者批量上传文件时,文件名称和内容不符合,错位问题

    百度编辑器ueditor批量上传附件时,上传后的文件和实际文件名称错误,比如实际是文件名“dongcoder.xls”,上传后可能就成了“懂客.xls”.原因就是,上传文件时是异步上传,同时进行,导致 ...

  3. Django和Ueditor自定义存储上传文件的文件名

    django台后默认上传文件名 在不使用分布式文件存储系统等第三方文件存储时,django使用默认的后台ImageField和FileField上传文件名默认使用原文件名,当出现同名时会在后面追加下随 ...

  4. UEditor调用上传图片、上传文件等模块

    来源:https://www.cnblogs.com/lhm166/articles/6079973.html 说到百度富文本编辑器ueditor(下面简称ue),我不得不给它一个大大的赞.我们在网站 ...

  5. 对百度的UEditor多图片上传的一些补充

    我已经写了一篇文章关于百度的UEditor提取多图片上传模块.如果还没有看过,请点击以下链接查看 http://www.cnblogs.com/luke1006/p/3719029.html 出差了两 ...

  6. Flask实战第57天:UEditor编辑器集成以及配置上传文件到七牛

    相关链接 UEditor:http://ueditor.baidu.com/website/​ 下载地址:http://ueditor.baidu.com/website/download.html# ...

  7. ueditor浏览器 无法上传文件.问题

    dll也都引用了 路径绝对tmd没问题 最后 我一点一点的调试发现了问题 草tmd百度程序员 */UE.ajax = function() { //创建一个ajaxRequest对象 var fnSt ...

  8. FLASH图片上传功能—从百度编辑器UEditor里面提取出来

    为了记录工作中碰到的各种问题,以及学习资料整理,今天开始,将以往的文章进行了一个整理,以后也开始认真的记录学习过程中的各种问题 在HTML里面的文件上传功能一直是个问题,为了实现上传文件大小限制,怎样 ...

  9. 【UEditor】 UEditor整合项目上传资源到阿里云服务器

    目录 关于此文 下载源码 JSP代码 Java代码 阿里云jar包引入配置 成功啦! 回到顶部 关于此文 项目中要实现编辑器生成带格式的html文档,存入模板,最后生成html的URL,所以选择了UE ...

随机推荐

  1. iOS开发--关于TableViewCell的可视化设置细节

    由于时间问题,本篇博文很简略. 1.关于设置Cell的边距问题

  2. H5一二事

    先回顾一下WEB技术的几个阶段 Web 1.0 内容为主,主要流行HTML和CSS Web 2.0 动态网页,流行AJAX/JavaScript/DOM H5 时代,WEB开发回归富客户端 那么H5肯 ...

  3. 虚拟机中MySQL连接问题:Lost connection to MySQL server at 'reading initial communication packet, system error: 0 以及 host is not allowed to connect mysql

    环境:在VirtualBox中安装了Ubuntu虚拟机,网络使用了NAT模式,开启了端口转发. 局域网内其他计算机访问虚拟机中的MySQL Server出现两个问题: Lost connection ...

  4. 你知道哪些linux命令,能把文件上传到远程linux服务器

    多数情况下 企业的服务基本都是部署在linux服务器 那对于测试同学,必须掌握基本的linux命令   至少要知道怎么部署整体环境   部署过程中,经常需要的操作,是向服务器上传部署包   你一般都是 ...

  5. centos6.5编译安装lamp开发环境

    一.系统以及软件的准备 系统及编译安装包的下载地址:http://pan.baidu.com/s/1jIjqinc   密码:ghc2 说明:由于centos6.5是分卷压缩的,且压缩为三个压缩包,所 ...

  6. Java 集合系列13之 WeakHashMap详细介绍(源码解析)和使用示例

    概要 这一章,我们对WeakHashMap进行学习.我们先对WeakHashMap有个整体认识,然后再学习它的源码,最后再通过实例来学会使用WeakHashMap.第1部分 WeakHashMap介绍 ...

  7. C语言中链表任意位置怎么插入数据?然后写入文件中?

    链表插入示意图:(图是个人所画)因为链表指针指来指去,难以理解,所以辅助画图更加方便. 插入某个学号后面图: 定义的结构体: struct student { ]; //学生学号 ]; //学生姓名 ...

  8. netfilter-在内核态操作网络数据包

    一.概述                                                    netfilter是自2.4内核的一个数据包过滤框架.可以过滤数据包,网络地址和端口转换 ...

  9. js实现打开网页自动弹出添加QQ好友邀请窗口

    我们有时进一些网面或专题页面会自动弹出一个加为好友的对话框了,在研究了很久之后发现可以直接使用js来实现,下面我们一起来看js实现打开网页自动弹出添加QQ好友邀请窗口的方法. 第一步.JS脚本 这个是 ...

  10. hadoop2.3cdh5.0.2 upgrade to hadoop2.5cdh5.5.0

    两台机器,nn1,nn2搭建的ha,同时又担任nn,dn,rm,nm,jn,zkfc,zk等职能. 以下是升级回滚再升级的记录.仅供参考,同时参考了cdh官网的说明,官网主要是使用CM的. 1 官网上 ...