ueditor单独图片和附件上传功能

首要要载入ueditor的2个js

    <script src="../ueditor/ueditor.config.js" type="text/javascript"></script>
    <script src="../ueditor/ueditor.all.js" type="text/javascript"></script>

  

    <table>
      <tr>
        <td>
            <asp:TextBox ID="txtImgurl" runat="server"></asp:TextBox>
            <input type="button" id="btnImageUpLoader" value="上传" onclick="upImage()" />
          </td>
      </tr>
      <tr>
        <td>
            <asp:TextBox ID="txtAttachments" runat="server"></asp:TextBox>
            <input type="button" id="btnFileUpLoader" value="上传" onclick="upFile()" />
          </td>
      </tr>
     </table>

  

<script type="text/javascript">
    UE.getEditor(‘txtContent‘);
</script>

   <script type="text/javascript">
       var myEditor = new UE.ui.Editor;
       myEditor.render(‘btnFileUpLoader‘);
       myEditor.ready(function() {
           myEditor.setDisabled();
           myEditor.hide();
           myEditor.addListener(‘beforeInsertImage‘, function (t, arg) {
                //因为可以上传多张,所以就用arg[0]
               $("#txtImgurl").attr("value", arg[0].src);
           });
           myEditor.addListener(‘afterUpfile‘, function (t, arg) {                    //这里这个事件需要到 dialogs\attachment\attachment.html 中                                                                               //在editor.execCommand("insertHTML",str);前面添加
               $("#txtAttachments").attr("value", arg[0].url);                        //editor.fireEvent(‘afterUpfile‘, filesList);
           });
       });
       function upImage() {
           var m;
           m = myEditor.getDialog("insertimage");
           m.render();
           m.open();
       }
       function upFile() {
           var f;
           f = myEditor.getDialog("attachment");
           f.render();
           f.open();
       }
       //在使用ueditor单独附件上传功能的时候点击"上传"按钮时不会出现 文件上传对话框,
       //Uncaught TypeError: Cannot read property ‘render‘ of undefined 这是因为在ueditor.config.js
       //中对toolbars 配置是把 ‘attachment‘ 工具去掉了,只要添加上去就可以了

   </script>
时间: 2024-08-03 05:08:03

ueditor单独图片和附件上传功能的相关文章

ueditor调用其中的附件上传功能

ueditor实际上是集成了webuploader, 在做内容发布的时候想既有ueditor又有单独的附件上传按钮,这时再加载一个webuploader就显得过于臃肿了,单独利用ueditor的上传功能就比较合适了 首先是显示附件上传dialog,两种方式 ue.ui._dialogs["attachment" + "Dialog"](推荐); dialog = parent.$EDITORUI[window.frameElement.id.replace( /_i

PHP仿微信多图片预览上传功能

PHP仿微信多图片预览下载演示地址:http://www.erdangjiade.com/js...生产图片区域,上传按钮#btn可替换自己想要的图片 [html] view plain copy在CODE上查看代码片派生到我的代码片 <ul id="ul_pics" class="ul_pics clearfix"> <li><img src="logo.png" id="btn" class=

jsp+ssm+tomcat配置ueditor(单图片,视频上传)

一.下载ueditor资源 二.减压资源,将ueditor包(我项目里的utf8-jsp)放到项目的WebContent下的js文件夹里. 把ueditor资源里 utf8-jsp\jsp\lib文件夹里的jar包拷贝到项目的lib里.(以idea为例)选择file--->Project Structure-->Libraries.导入ueditor-1.1.2.jar包. 三.在需要使用的ueditor的页面引用下图的js(顺序是固定的) 在页面添加 <textarea name=&q

(转)Android学习-使用Async-Http实现图片压缩并上传功能

(转)Android学习-使用Async-Http实现图片压缩并上传功能 文章转载自:作者:RyaneLee链接:http://www.jianshu.com/p/940fc7ba39e1 让我头疼一个星期的图片批量上传服务器的问题最后受这篇文章的作者启发而解决,自己之前一直执着于通过uri地址找到图片然后上传图片,却没想过直接上传图片本身.感谢作者的博客和启发. 前言 (转载请注明出处,谢谢!) 最近在做一个小项目,项目中要实现上传图片到服务器,而这个例子是实现图片的尺寸压缩,将获取到的压缩图

JSP Ueditor 实现图片跨域上传

Ueditor的单图上传,在官方文档上明确写了不支持 然后通过百度找了许多方案,终于有一个可以解决了. http://www.cnblogs.com/hpnet/p/6290452.html 不过那个是.NET版本的,按他的方案,自己写了一个JAVA版本的. 核心思路就是把数据重发到原地址. 所以在原地址控制层写中转代码: 修改Ueditor中的controller.jsp中的代码,在获取上传数据到,再跳转到原地址界面:

JSP+SpringMVC框架使用WebUploader插件实现注册时候头像图片的异步上传功能

一.去官网下载webuploader文件上传插件 https://fex.baidu.com/webuploader/ 下载好后把它放到Javaweb项目的文件夹中(我放到了webcontent下面的static里面) 二.复制前端的样式 把这段代码放到你想要放到的位置(刷新页面和示例中不一样?不用担心因为你还没有初始化{就是还没有导入swf文件},指定路径后刷新应该就好了) 三.复制实现文件异步上传的js代码(这里我们只复制图片上传的部分) js源码的中文是乱码,应该是缺少谷歌改编码格式的插件

easyUI + swfupload 多附件上传功能

public void UPLOADFILED() { Date dt = new Date(System.currentTimeMillis()); SimpleDateFormat sdf = new SimpleDateFormat("yyyyMMddHHmmssSSS"); String fileName = sdf.format(dt); int index = getUploadFileName().lastIndexOf("."); //得到文件扩展名

odoo开发笔记 -- 附件上传

附件上传基本原理实现,可以参考这篇: https://www.cnblogs.com/ljwTiey/p/7348291.html http://blog.csdn.net/wangnan537/article/details/41903159 首先我们看一下odoo界面默认的附件功能,有木有感觉不是很友好!囧 :) 下面给小伙伴们介绍另一种odoo自带的附件管理方式! 首先,在你的模型中增加如下定义: ##############################################

从web编辑器 UEditor 中单独提取图片上传,包含多图片单图片上传以及在线涂鸦功能

UEditor是由百度web前端研发部开发所见即所得富文本web编辑器,具有轻量,可定制,注重用户体验等特点,开源基于MIT协议,允许自由使用和修改代码.(抄的...) UEditor是非常好用的富文本web编辑器,而且全中文API和注释,方便学习和使用.特别是图片上传查看及涂鸦功能极为喜欢,但是有很多情况我们并不需要Web编辑器,而只需要图片上传.那么问题来了,提取图片上传哪家强..... 网上有很多图片上传的控件.插件.但都不是那么的完美,有的只有一张图片上传不包含批量上传,有的没有图片查看