多图上传 - Web Uploader
http://fex.baidu.com/webuploader/
官方DEMO,我都不想说了,各种问题。参考ShuaiBi文章
http://www.cnblogs.com/ismars/p/4176912.html
用了bootstrap 代码百度网盘地址:http://pan.baidu.com/s/1pJkj9wf
自己参照改改就好了。

//所有文件上传完毕
uploader.on("uploadAccept", function (file, response) {
//console.info(file)
//console.info(response.filePath) //----给头像赋值----
$("#EditForm input[name='Header_Ico']").val("http://" + window.location.host + response.filePath);
//提交表单
//if (hasError) {
// // 通过return false来告诉组件,此文件上传有错。
// return false;
//}
});
为了页面不刷新,我只有采用这个手段了,JS渣的说。
//开始上传
$("#ctlBtn").click(function () {
console.info(uploader)
uploader.upload();
return false;//页面不刷新
});
问题1:
$(…).live("mouseout", function () not a function
<script src="~/Scripts/jquery.min.js"></script>
改为
<script src="~/Scripts/jquery-1.8.2.js"></script>
问题2:
上传3张图片,组成格式
中间以“,”隔开
p://localhost:28278/Upload/4039280d9d604a7dbdf85f3282d509a7.png,http://localhost:28278/Upload/120a5587e8bc43449c5ca13142145b05.png
代码:
// 文件上传成功,给item添加成功class, 用样式标记上传成功。
uploader.on('uploadSuccess', function (file, response) {
console.info(uploader.getStats())
var temp = "http://" + window.location.host + response.filePath;
//判断uploader.getStats().successNum状态(在uploadSuccess)
if (uploader.getStats().successNum == 1) {
//console.info(0)
$("#EditForm input[name='photourl']").val(temp);
} else {
//console.info(1)
$("#EditForm input[name='photourl']").val($("#EditForm input[name='photourl']").val() + "," + temp);
} $('#' + file.id).addClass('upload-state-done');
});
多图上传 - Web Uploader的更多相关文章
- C# WEB.API 多图上传
using System; using System.Collections.Generic; using System.Linq; using System.Net; using System.Ne ...
- PHP 多图上传,图片批量上传插件,webuploader.js,百度文件上传插件
PHP 多图上传,图片批量上传插件,webuploader.js,百度文件上传插件(案例教程) WebUploader作用:http://fex.baidu.com/webuploader/gett ...
- hdjs---laravel 框架使用hdjs 实现多图上传功能
hdjs---laravel 框架使用hdjs 实现多图上传功能 一.总结 一句话总结: [在网上找hdjs的使用实例]和[能遇见讲hdjs的视频],也是完全搞懂hdjs的不错的方式 1.hdjs中的 ...
- Webuploader 简单图片上传 支持多图上传
简介: 通过webuploader 实现简单的图片上传功能,支持多张图上传 官方文档传送门:http://fex.baidu.com/webuploader/getting-started.html# ...
- JS案例之4——Ajax多图上传
近期项目中有好几次用到多图上传,第一次在项目中真正用到Ajax技术,稍微整理了下,贴个案例出来. 我们传统的做法是当用户提交一个表单时,就向web服务器端发送一个请求.服务器接受并处理传来的表单信息, ...
- ueditor编辑器多图上传为什么顺序打乱了
我上一个版本用的是ueditor1.3.6,自从1.4.2版以后,“前端上传模块统一改用webuploader”,ueditor在多图上传一直考虑漏掉了图片顺序的问题. 我的网站在用户上传图片文章的时 ...
- Vue的移动端多图上传插件vue-easy-uploader
原文地址 前言 这段时间赶项目,需要用到多文件上传,用Vue进行前端项目开发.在网上找了不少插件,都不是十分满意,有的使用起来繁琐,有的不能适应本项目.就打算自己折腾一下,写一个Vue的上传插件,一劳 ...
- 利用html5的FormData对象实现多图上传
<html> <head> <title>FormData多图上传演示</title> </head> <body> <a ...
- onethink多图上传
模板处理, 可以参考 checkbox 的. 注:edit 方法的 基本一样,需要先把已有的数据展示出来,绑定双击事件,删除图片 需要先绑定给已经展示出来的图片, uploadPicture 的cal ...
随机推荐
- Reflow(渲染)和Repaint(重绘)
Reflow(渲染):对于DOM结构中的各个元素都有自己的盒模型,浏览器根据各种样式(浏览器的.开发人员定义的等)来计算,并根据计算结果将元素放到它该出现的位置,这个过程称之为reflow. refl ...
- ubuntu 安装mysql
1.检查是否已经安装mysql netstat -tap | grep mysql 2.安装mysql 2.1 先更新下软件列表 :sudo apt-get update 2.2 安装mysql :s ...
- BZOJ 4665: 小w的喜糖
Sol DP+容斥. 这就是一个错排的扩展...可是想到容斥却仅限于种数的容斥,如果种数在一定范围内我就会做了QAQ. 但是容斥的是一定在原来位置的个数. 发现他与原来的位置无关,可以先把每个同种的糖 ...
- chkconfig用法 LINUX
chkconfig用法 有时候为了方便管理,我们常常喜欢在Linux中将之安装为服务,然后就可以使用服务来管理. 但是当我们运行安装服务的命令时候,假设服务名为myservice #chkconfig ...
- 【GoLang】golang中可以直接返回slice吗?YES
结论: 可以,slice本质是结构体,返回slice时返回的是结构体的值,结构体的指针.len.cap等信息也全部返回了. 如下: type slice struct { start *uintptr ...
- 用Kibana和logstash快速搭建实时日志查询、收集与分析系统
Logstash是一个完全开源的工具,他可以对你的日志进行收集.分析,并将其存储供以后使用(如,搜索),您可以使用它.说到搜索,logstash带有一个web界面,搜索和展示所有日志. kibana ...
- 【leetcode】Search in Rotated Sorted Array
Search in Rotated Sorted Array Suppose a sorted array is rotated at some pivot unknown to you before ...
- robotFramework——截屏
测试执行过程中进行截屏并且保存,是任何一款自动化测试工具或者框架必备的功能.那么Robotframework如何进行截屏呢?Robotframework提供了一个“Screenshot”库. 使 ...
- 【转】.so兼容32位和64位
本文转自:http://blog.csdn.net/fwt336/article/details/51700300 安卓的兼容性是一个很令人头疼的问题,这几天又遇到了,还好还是解决了. 我遇到的问题是 ...
- zju3430
题意:给出多个加密的模式串,和多个待匹配的串,问每个串里出现了多少种模式串.加密方法是把每3bytes加密成按6bits一个对应成4个字符,对应方法题里给了. 分析:除了解密之外,基本是个赤裸裸的AC ...