fileupload实现控制大小进行图片上传
if ($(".img-upload").length > 0) {
$('.img-upload').fileupload({
type: 'POST',
url: "/app/uploadImage",
dataType: 'json',
acceptFileTypes: /(\.|\/)(gif|jpe?g|png)$/i,
disableImageResize: /Android(?!.*Chrome)|Opera/
.test(window.navigator && navigator.userAgent),
add:function(e,data){//控制图片大小
var goUpload=true;
var uploadFile=data.files[0];
if(uploadFile.size>512000){
goUpload=false;
$('.master-updefeat').css("visibility","visible")
}
if(goUpload==true){
$('.master-updefeat').css("visibility","hidden")
data.submit();
}
},
done: function(e, data) {
var imgdata = data.result;
if (imgdata.errcode == 0) {
$(".J-masternum").hide();
$(".J-masterimg").attr("src", imgdata.data.url);
}
},
change: function(e, data) {//图片上传时显示进度
$(".J-masternum").show();
},
progressall: function(e, data) {//进度
var progress = parseInt(data.loaded / data.total * 100, 10);
$(".J-masternum").text(progress + '%');
},
error: function(e, data) {
错误回调
},
});
}
下面为对应的HTML代码
<div class="clearx ">
<div class="master-addicon">
<img src="{{subaccount['avatar']}}" class="J-masterimg" />
</div>
<div class="master-addiconinfo">
<div class="master-iconnotice">图标尺寸不超过250*250,大小不超过500K</div>
<div class="clearx">
<a href="javascript:;" class="master-filebtn">上传图标<input type="file" name="files[]" class="img-upload" /></a>
<span class="master-num J-masternum">0%</span>
</div>
<div class="master-updefeat">图片上传失败,请<a href="javascript:;" class="J-uploads">重试<input type="file" name="files[]" class="img-upload" /></a></div>
</div>
</div>
fileupload实现控制大小进行图片上传的更多相关文章
- jsp中简易版本的图片上传程序
1.下载相应的组件的最新版本 Commons FileUpload 可以在http://jakarta.apache.org/commons/fileupload/下载 附加的Commons IO ...
- CKEditor 自主控制图片上传
在ASP.NET中使用CKEditor编辑器,如果想控制图片上传,即把上传的图片路径名存到数据中,可以自定义一个上传功能 首先自定义CKEditor的配置文件 在config.js中添加以下代码,红色 ...
- 前端手势控制图片插件书写四(图片上传及Ios图片方向问题)
1.在图片上传中,使用的input的type为File的属性.使用filereader的Api let that = this; var file = document.getElementById( ...
- 图片上传并显示(兼容ie),图片大小判断
图片上传并显示(兼容ie),图片大小判断 HTML <div id="swf" style="margin: 0 auto;text-align: center;& ...
- KindEditor 修改多图片上传显示限制大小和张数
在使用KindEditor的时候用到多图片上传时,提示有最多上传20张图片,单张图片容量不超过1MB: 修改的文件的地方在:kindeditor\plugins\multiimage\multiima ...
- 视频(其他)下载+tomcat 配置编码+图片上传限制大小
视频下载:前台 jsp function downVideo(value,row,index){ return '<a href="<%=basePath%>admin/v ...
- SpringMVC 图片上传,检查图片大小
使用SpringMVC+Spring 前端提交图片文件到Controller,检查上传图片大小是否符合要求 直接上代码了 1.校验图片大小 这里提供出验证的方法,用于在需要校验的地方调用 /** * ...
- 在ASP.NET MVC下实现单个图片上传, 客户端服务端双重限制图片大小和格式, 服务端裁剪图片
在"MVC文件图片ajax上传轻量级解决方案,使用客户端JSAjaxFileUploader插件01-单文件上传"一文中,使用JSAjaxFileUploader这款插件实现了单文 ...
- Asp.net中FileUpload控件实现图片上传并带预览显示
单一图片上传——“选择”+“上传”,.NET默认模式: 1.实现原理: 采用FileUpload控件默认的使用方式,先由“选择”按钮选择图片,然后单击“上传”按钮完成上传,并可在“上传”按钮的 ...
随机推荐
- LaTeX新人30分钟从完全陌生到基本入门
From:http://www.360doc.com/content/13/0117/11/2886802_260681908.shtml 对于真心渴望迅速上手LaTeX的人,前言部分可以跳过不看. ...
- Knockout, Web API 和 ASP.Net Web Forms 进行简单数据绑定
使用Knockout, Web API 和 ASP.Net Web Forms 进行简单数据绑定 原文地址:http://www.dotnetjalps.com/2013/05/Simple-da ...
- CLR中的垃圾回收机制
CLR中采用代(generation)来作为其垃圾回收的一种机制,其唯一的目的是提升程序的性能.基予代的垃圾回收器有以下假设: ·对象越新,其生存周期越短. ·对象越老,其生存周期越长. ·回收堆的一 ...
- java使用javamail读取邮箱(收件箱为例)
import java.io.BufferedInputStream; import java.io.BufferedOutputStream; import java.io.File; import ...
- Couchbase集群和Redis集群解析
Couchbase集群和Redis集群解析 首先,关于一些数据库或者是缓存的集群有两种结构,一种是Cluster;一种是master-salve. 关于缓存系统一般使用的就是Redis,Redis是开 ...
- 使用protobuf编写配置文件以及读写
.proto文件示例 message Configure { required ; required uint32 port = ; } 写配置文件 Configure config; config. ...
- kAudioSessionProperty_AudioCategory 的设置
iPhone上面有两种播放外音的模式:听筒模式和话筒模式,听筒当然是打电话时用的,那个声音当然很小了, 但是开放中,ios默认的就是这种模式,所以在播放外应的时候要加代码重新设置下,如下: ...
- python 爬虫总结【转】
1.基本抓取网页 get方法 import urllib2 url = "http://www.baidu.com" response = urllib2.urlopen(url) ...
- NHibernate Session-per-request and MiniProfiler.NHibernate
NHibernate Session-per-request and MiniProfiler.NHibernate 前言 1.本文以mvc3为例,借鉴开源项目 NerdDnner项目完成nhiber ...
- linux下面安装配置mongoDB
不知道为什么官网最新的2.4我一直解压失败 下载之前确认一下你的操作系统是64位的还是32位的对应去下载 64位链接:http://fastdl.mongodb.org/linux/mongodb-l ...