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实现控制大小进行图片上传的更多相关文章

  1. jsp中简易版本的图片上传程序

    1.下载相应的组件的最新版本 Commons FileUpload 可以在http://jakarta.apache.org/commons/fileupload/下载 附加的Commons IO   ...

  2. CKEditor 自主控制图片上传

    在ASP.NET中使用CKEditor编辑器,如果想控制图片上传,即把上传的图片路径名存到数据中,可以自定义一个上传功能 首先自定义CKEditor的配置文件 在config.js中添加以下代码,红色 ...

  3. 前端手势控制图片插件书写四(图片上传及Ios图片方向问题)

    1.在图片上传中,使用的input的type为File的属性.使用filereader的Api let that = this; var file = document.getElementById( ...

  4. 图片上传并显示(兼容ie),图片大小判断

    图片上传并显示(兼容ie),图片大小判断 HTML <div id="swf" style="margin: 0 auto;text-align: center;& ...

  5. KindEditor 修改多图片上传显示限制大小和张数

    在使用KindEditor的时候用到多图片上传时,提示有最多上传20张图片,单张图片容量不超过1MB: 修改的文件的地方在:kindeditor\plugins\multiimage\multiima ...

  6. 视频(其他)下载+tomcat 配置编码+图片上传限制大小

    视频下载:前台 jsp function downVideo(value,row,index){ return '<a href="<%=basePath%>admin/v ...

  7. SpringMVC 图片上传,检查图片大小

    使用SpringMVC+Spring 前端提交图片文件到Controller,检查上传图片大小是否符合要求 直接上代码了 1.校验图片大小 这里提供出验证的方法,用于在需要校验的地方调用 /** * ...

  8. 在ASP.NET MVC下实现单个图片上传, 客户端服务端双重限制图片大小和格式, 服务端裁剪图片

    在"MVC文件图片ajax上传轻量级解决方案,使用客户端JSAjaxFileUploader插件01-单文件上传"一文中,使用JSAjaxFileUploader这款插件实现了单文 ...

  9. Asp.net中FileUpload控件实现图片上传并带预览显示

    单一图片上传——“选择”+“上传”,.NET默认模式: 1.实现原理:     采用FileUpload控件默认的使用方式,先由“选择”按钮选择图片,然后单击“上传”按钮完成上传,并可在“上传”按钮的 ...

随机推荐

  1. Xcode中如何集成Unity

    项目中需要集成unity,摸索了大半周,碰到了很多坑,终于搞定. 我的方法是,通过unity导出一个空的iOS项目,然后再新建一个Xcode项目,针对配置页面一一对应.直到配置完全一样,然后倒入相关资 ...

  2. [转]Mac's and serial TTY's

    Mac's are excellent tools for accessing serial device TTY ports (to console into PBX's, switches, an ...

  3. A2D规则引擎

    A2D规则引擎 写了个简单的规则引擎,普通情况够用了: 比如2家公司有各自的利率计算规则,如下: 在C#方面,没有写在C#的业务逻辑代码中,而是移到了外部规则文件中,如(ACompanyRatePol ...

  4. linux学习心得之vim/Cvim篇

    linux学习心得之vim/Cvim篇 在linux 下,vim 时一种最常见的编辑器,很多linux的发行版就自带了.我的是CentOS 6.3. 基本上Vim共分为3种模式,分别是一般模式,编辑模 ...

  5. Android Jni引用第三方库

    在jni下新建文件夹(jniLib)用来存放第三方so库: 将so拷贝到jniLib下,新建一个Android.mk文件: LOCAL_PATH:= $(call my-dir) include $( ...

  6. 关于JSF国际化问题

    由于最近一个项目的MVC层框架用的是JSF,所以在摸索中遇到了不少的问题,其中有一项就是关于国际化的的问题. 小弟在网上找了很多的资料,其实无外乎内容就都那样,可不知是小弟人品太差还是由于确实技术上有 ...

  7. Extjs4.2 Tree使用技巧

    Extjs4.2 Tree使用技巧小结demo 本案例使用了Ext.Tree.Panel的如下知识点: 1.刷新.重新加载Tree,定位到上次的节点位置 2.Tree的右键操作 3.Extjs4.x ...

  8. Android ListView中添加不同的多种布局

    最近做项目要使用ListView加载不同的布局,由于自己写的代码不能贴出,故找了一篇自认为比较好的blog给分享出来,希望对用到此项技术的同学有点帮助. http://logc.at/2011/10/ ...

  9. linux主机load average的概念&&计算过程&&注意事项

    最近开发的一个模块需要根据机房各节点的负载情况(如网卡IO.load average等指标)做任务调度,刚开始对Linux机器load average这项指标不是很清楚,经过调研,终于搞清楚了其计算方 ...

  10. 通用性安装redis和基本配置

    之前聊redis的文章比较多了,但还没写一下安装和配置方面的总结. 总的来说,一般运行环境都是centos,开发环境无外乎windows,linux,mac os,我在这三个平台都安装和部署过redi ...