Ueditor 单独使用上传图片及上传附件方法

1

<script type="text/plain" id="upload_ue"></script>

2

<script type="text/javascript">
    //重新实例化一个编辑器,防止在上面的editor编辑器中显示上传的图片或者文件
    var _editor = UE.getEditor(‘upload_ue‘);
    _editor.ready(function () {
        //设置编辑器不可用
        //_editor.setDisabled();
        //隐藏编辑器,因为不会用到这个编辑器实例,所以要隐藏
        _editor.hide();
        //侦听图片上传
        _editor.addListener(‘beforeInsertImage‘, function (t, arg) {
            //将地址赋值给相应的input
            $("#picture").attr("value", arg[0].src);
            //图片预览
            $("#preview").attr("src", arg[0].src);
        })
        //侦听文件上传
        _editor.addListener(‘afterUpfile‘, function (t, arg) {
            $("#file").attr("value", _editor.options.filePath + arg[0].url);
        })
    });
    //弹出图片上传的对话框
    function upImage() {
        var myImage = _editor.getDialog("insertimage");
        myImage.open();
    }
    //弹出文件上传的对话框
    function upFiles() {
        var myFiles = _editor.getDialog("attachment");
        myFiles.open();
    }
</script>

3 直接在按钮上调用 upFiles() 、 upImage() 方法即可

4 最新版本中

_editor.addListener(‘afterUpfile‘, function (t, arg)

事件无响应,解决方法:

在 ueditor.all.js  或 ueditor.all.min.js  中 找到

UE.plugin.register(‘insertfile‘, function (){
 .....
});

filelist = utils.isArray(filelist) ? filelist : [filelist]; 

后面 ,或者在这个函数结束地方添加一行代码

 if(me.fireEvent(‘afterUpfile‘, filelist) === true){  return;  }

即可解决该问题,感谢http://kissthink.com/archive/--4771.html的分享

时间: 2024-10-12 19:22:09

Ueditor 单独使用上传图片及上传附件方法的相关文章

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

来源:https://www.cnblogs.com/lhm166/articles/6079973.html 说到百度富文本编辑器ueditor(下面简称ue),我不得不给它一个大大的赞.我们在网站建设.前端开发时,网站的内容管理就使用了它.对于它的多图片上传和附件上传,个人感觉很好用,我就琢磨着是否可以外部调用多图上传和附件上传组件为自己所用,并封装成一个插件,节省单独开发的成本. 有了这个想法后,着手操作,理下实现思路,得出实现的关键在于监听这两个组件在编辑器里的插入动作.打开源码,苦心研

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

出于兴趣爱好,前段时间自己尝试写了一个叫simple的cms,里面使用了百度ueditor编辑器,发现它的多图片上传模块很不错,用起来很方便,又可以选择已经上传好的图片.正好我又是个懒人,发现有现成的自己就不想新开发了.于是我就想,是不是可以调用这个上传模板为自己所用呢? 有了这个想法后,我就到网上查阅资料,可惜资料少的可怜,都不能很好解决我的问题.于是觉得还是自己动手丰衣足食,皇天不负苦心人,终于摸索出解决方法,现在分享出来,和自己有同样想法的小伙伴. 代码如下: <html> <he

IE8升级新版Flash Player ActiveX14导致的discuz图片附件无法上传 解决方法

之前发的这篇文章被编辑之后丢失了,无奈从百度快照找来重新发布,不知道csdn抽啥风 架不住sb adobe的频繁升级提示,手欠升级到了了flash player 14,结果IE8下所有discuz论坛中都无法看到上传图片的按钮了 没办法,遇到问题就解决吧 刚好在解决IE11遇到编辑器不显示问题的时候看到discuz编辑器文件上传有非flash解决方案 所以这个问题看上去就不难了,把普通上传给打开就行了 编辑discuz文件/template/default/forum/editor_menu_f

修改WordPress中上传附件2M大小限制的方法/php+iis上传附件默认大小修改方法

在服务器上架设好WordPress后,使用过程中发现,上传附件大小有2M的限制 话说服务器就是本机,可以直接把文件拖到附件存储文件夹下,然后在需要附件的地方引用链接 可是这种落后的方法终究不是办法,还是应该修改大小限制,使用才方便. 在网搜了一下,方法有挺多,但大部分都是不完整信息的重复,下面说说我最后更改的方法,仅供参考. 服务器版本是:Windows Server 2003 SP2 WordPress架设:IIS+PHP+MySql 1.首先在网站根目录下建一个info.php文件 例如:D

Bugzilla不能上传附件解决方法

Bugzilla不能上传附件 环境:win7.Bugzilla 错误提示:CGI.pm open of tmpfile \\CGItemp5760/QQ.png failed: No such file or directory ; 一种解决方法:在C盘创建一个目录temp:找到CGI.pm文件,路径为C:/bugzilla/lib/CGI.pm.用记事本打开CGI.pm,找到变量CGITempFile::TMPDIRECTORY # HARD-CODED LOCATION FOR FILE U

上传附件验证方法

<input type="file" value="选择图片" name="accountLicence" onchange="fileChange(this,'pic')" class="inputText SelectBtn"> <input type="file" value="选择附件" name="accountLicence&q

开发日志:struts2使用commons.fileupload上传附件,并解决upload.parseRequest(request)为空的问题

要做一个phongap开发的App上传文件到服务器的Action,打算使用commons.fileupload的方式 接口jsp页面 <form action="uploadAction.action" method="post" enctype="multipart/form-data"> <table> <tr><td>上传附件:uploadAction.action</td><

Java往事之《百度UEditor插件配置图片上传问题》

百度UEditor插件配置图片上传问题 前言:之前第一次用到UEditor插件的时候,一脸懵逼!没错就是一脸懵逼,去UEditor插件官网下载了一个开发版的.然后对于新鲜技术好奇,本人就迫不及待的把它copy到了我的项目里,运行之后发现鼠标点到输入框里面的时候,什么鬼啊,握了棵草!上传图片的插件置灰了如下图1,一看还有一个多图片上传的插件还在,就赶紧点了一下,点开的那一瞬间我吃了一鲸,如下图2! 图1 图2 很好!下面看一下如何解决这个问题. 1.首先你可以到官网Ueditor,查看很详细的文档

上传附件使用jquery-form.js的ajaxsubmit提交一点记录

最近项目用到了附件附件上传功能,因为上传附件想尽量控制在一个控件上传附件并回显在下方的列表中,选择附件则触发上传. 刚开始使用了swfupload.js的flash控件进行上传,但是在IE中如果没有相应控件就无法draw出上传控件,应该是浏览器段没有flash控件造成的. 最后还是改回html的type="file"来实现上传,因为附件上传成功后需要回调函数并在下方列表中回显:所以纯粹的使用form表单提交无法回调需要的数据.而直接使用js取得input内容组装为file对象使用aja