plupload多个实例很简单,但是麻烦的是,返回的时候没有明显标记区分input的id,好蛋疼

var uploader = new plupload.Uploader({ //实例化一个plupload上传对象
// browse_button: 'browse',
browse_button: ['browse', 'browse_logo'],
url: '/admin/System/uploadImg',
flash_swf_url: 'js/Moxie.swf',
silverlight_xap_url: 'js/Moxie.xap',
filters: {
max_file_size: '10mb', //最大上传文件大小(格式100b, 10kb, 10mb, 1gb)
mime_types: [ //允许文件上传类型
{
title: "files",
extensions: "jpg,png,gif,jpeg"
}
]
},
multi_selection: false,//单选,true多选
init: {
FilesAdded: function(up, files) { //文件上传前,就是打开文件对话框,选好文件之后触发
uploader.start();
},
FileUploaded: function(up, file, info) { //文件上传成功的时候触发 if ($scope.current_input_id == 'browse') {
var data = eval("(" + info.response + ")");
$scope.$apply(function() {
var tempImg = {};
tempImg.id = file.id;
tempImg.src = data.data[0];
tempImg.is_default = $scope.productImageList.length ? false : true;
$scope.main_image = $scope.productImageList.length ? $scope.main_image : data.data[0];
$scope.productImageList.push(tempImg); //注释掉的代码是为了预防多图
});
}
if ($scope.current_input_id == 'browse_logo') {
var data = eval("(" + info.response + ")");
$scope.$apply(function() {
var tempLogo = {};
tempLogo.id = file.id;
tempLogo.src = data.data[0];
tempLogo.is_default = $scope.logoImageList.length ? false : true;
$scope.main_logo_image = $scope.logoImageList.length ? $scope.main_logo_image : data.data[0];
$scope.logoImageList.push(tempLogo); //注释掉的代码是为了预防多图
});
} },
Error: function(up, err) { //上传出错的时候触发
alert(err.message);
}
}
});
browse_button: ['browse', 'browse_logo']就是多实例,我这里使用的是angularjs
<input type="file" id="browse_logo" name="file" class="upload upload-file" ng-click="uploadBtn('browse_logo')" style="margin-top:78px;">

你可以在整个组件加上一个onclick事件,传递一个参数过去就可以知道是哪个实例做了上传动作

    $scope.uploadBtn = function(id) {
$scope.current_input_id = id;
};
建议使用别的插件,百度的webuploader比较好使,而且网上关于Plupload的中文开发文档都比较旧了,有时间翻译一版
http://fex.baidu.com/webuploader/

plupload多个实例,返回区分实例的返回的更多相关文章

  1. Oracle创建表语句(Create table)语法详解及示例、、 C# 调用Oracle 存储过程返回数据集 实例

    Oracle创建表语句(Create table)语法详解及示例 2010-06-28 13:59:13|  分类: Oracle PL/SQL|字号 订阅 创建表(Create table)语法详解 ...

  2. ORACLE11g R2【单实例 FS→单实例FS】

    ORACLE11g R2[单实例 FS→单实例FS] 本演示案例所用环境:   primary standby OS Hostname pry std OS Version RHEL6.5 RHEL6 ...

  3. ORACLE10g R2【单实例 FS→单实例FS】

    ORACLE10g R2[单实例FS→单实例FS] 本演示案例所用环境:   primary standby OS Hostname pry std OS Version RHEL5.8 RHEL5. ...

  4. Java-Runoob-高级教程-实例-环境设置实例:4.Java 实例 – 如何查看当前 Java 运行的版本?

    ylbtech-Java-Runoob-高级教程-实例-环境设置实例:4.Java 实例 – 如何查看当前 Java 运行的版本? 1.返回顶部 1. Java 实例 - 如何查看当前 Java 运行 ...

  5. Java-Runoob-高级教程-实例-环境设置实例:3.Java 实例 - 如何执行指定class文件目录(classpath)?

    ylbtech-Java-Runoob-高级教程-实例-环境设置实例:3.Java 实例 - 如何执行指定class文件目录(classpath)? 1.返回顶部 1. Java 实例 - 如何执行指 ...

  6. Java-Runoob-高级教程-实例-环境设置实例:2.Java 实例 – Java 如何运行一个编译过的类文件?

    ylbtech-Java-Runoob-高级教程-实例-环境设置实例:2.Java 实例 – Java 如何运行一个编译过的类文件? 1.返回顶部 1. Java 实例 - 如何执行编译过 Java ...

  7. Java-Runoob-高级教程-实例-环境设置实例:1.Java 实例 – 如何编译一个Java 文件?

    ylbtech-Java-Runoob-高级教程-实例-环境设置实例:1.Java 实例 – 如何编译一个Java 文件? 1.返回顶部 1. Java 实例 - 如何编译 Java 文件  Java ...

  8. SQL:安装多个实例,修改实例端口号,和IP加端口号连接实例

    sql server 安装第一个实例,默认实例的端口是1433, 一个库中如果有多个实例,从第二个实例开始的端口是动态端口,需要的话,自己手工指定为静态端口,如指定第二个实例为1434 或着随意一个如 ...

  9. SuperSocket入门(三)-Telnet多服务实例和服务实例交互配置详解

        在SuperSocket入门(二)中我们已经简单了解了通过配置App.config文件使用BootStrap启动SuperSocket服务.我们先来看一下上个案例中的基本配置文件示例: < ...

随机推荐

  1. 【转】关于免费SSL证书的那些事儿

    根据 Let’s Encrypt CA 的统计,截至 2017 年 11 月,Firefox 加载的网页中启用 HTTPS 的比例占 67%,比去年底的 45% 有巨大提升.浏览器开发商如 Mozil ...

  2. Sql Server 增加字段、修改字段、修改类型、修改默认值(转)

    转:http://www.cnblogs.com/pangpanghuan/p/6432331.html Sql Server 增加字段.修改字段.修改类型.修改默认值 1.修改字段名: alter ...

  3. IDEA community + Gradle + Gretty 调试 servlet 应用 + war包部署到tomcat

    参考:https://guides.gradle.org/building-java-web-applications 1.运行和调试 IDEA创建gradle项目,项目结构如下 各个文件: buil ...

  4. 如何查看.Net Framework版本

    地址栏输入 %systemroot%\Microsoft.NET\Framework,或win+R快捷方式打开“运行”窗口,输入%systemroot%\Microsoft.NET\Framework ...

  5. Java编程的逻辑 (87) - 类加载机制

    本系列文章经补充和完善,已修订整理成书<Java编程的逻辑>,由机械工业出版社华章分社出版,于2018年1月上市热销,读者好评如潮!各大网店和书店有售,欢迎购买,京东自营链接:http:/ ...

  6. AI人工智能顶级实战工程师 课程大纲

    课程名称    内容    阶段一.人工智能基础 — 高等数学必知必会     1.数据分析    "a. 常数eb. 导数c. 梯度d. Taylore. gini系数f. 信息熵与组合数 ...

  7. SpirngBoot之整合Swagger2

    前言 swagger,中文"拽"的意思.它是一个功能强大的api框架,它的集成非常简单,不仅提供了在线文档的查阅, 而且还提供了在线文档的测试.另外swagger很容易构建rest ...

  8. 蜕变成蝶~Linux设备驱动之按键设备驱动

    在上述的驱动系列博客中,我们已经了解了关于阻塞和非阻塞.异步通知.轮询.内存和I/O口访问.并发控制等知识,按键设备驱动相对来说是比较简单的,本章内容可以加深我们对字符设备驱动架构.阻塞与非阻塞.中断 ...

  9. 真正让HTML标签、DIV、SPAN拥有onfocus和onblur,聚焦和失焦

    转载:http://blog.sina.com.cn/s/blog_7dfe67db01010lnq.html 默认火狐或者其他浏览器里DIV和其他普通标签是不具有onfocus和onblur事件的, ...

  10. RTX参数配置

        RTX操作系统的配置工作是通过配置文件RTX_Conf_CM.c实现.     在MDK工程中打开文件RTX_Conf_CM.c,可以看到如下图5.2所示的工程配置向导:  20 Task C ...