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控件默认的使用方式,先由“选择”按钮选择图片,然后单击“上传”按钮完成上传,并可在“上传”按钮的 ...
随机推荐
- QQ三方登录步骤详解
首先,登录QQ互联:http://connect.qq.com/intro/login ,注册成为开发者 选择申请加入,并创建你的应用. 创建成功后可以获取到appid和appkey 在网站的主页引 ...
- Ecological Premium - UVa10300
欢迎访问我的新博客:http://www.milkcu.com/blog/ 原文地址:http://www.milkcu.com/blog/archives/uva10300.html 题目描述 Pr ...
- MySQL中char和varchar有啥区别?优缺点是啥?
在mysql教程中char与varchar的区别呢,都是用来存储字符串的,只是他们的保存方式不一样罢了,char有固定的长度,而varchar属于可变长的字符类型. char与varchar的区别 c ...
- 浅谈DevExpress<二>:设计一个完整界面(2)
下面来把剩下的工作做完,换肤功能昨天已近讨论过,今天就不重复了.首先建立三个全局变量,一个存放文件路径,一个存放数据,一个存放过滤条件. string DBFileName; DataView dat ...
- 理解对象模型图(Reading OMDS)
理解对象模型图(Reading OMDS) 引言 这篇文章大部分内容是翻译的帮助资料里的东西.学习技术,英语是个好工具.一直把英语的地位看得和技术一样重,也会强迫自己看英语版的技术书籍(都是PDF版的 ...
- [整理]在命令行执行 UIAutomation
instruments -t /Developer/Platforms/iPhoneOS.platform/Developer/Library/Instruments/PlugIns/Automati ...
- [转]从命令行往 iOS 设备上安装程序
link:http://www.stewgleadow.com/blog/2011/11/05/installing-ios-apps-on-the-device-from-the-command-l ...
- 企业架构研究总结(28)——TOGAF架构开发方法(ADM)之需求管理阶段
1.11 需求管理(Requirements Management) 企业架构开发方法各阶段——需求管理 1.11.1 目标 本阶段的目标是定义一个过程,使企业架构的需求可以被识别.存储并与其他架构开 ...
- 【Yom框架】漫谈个人框架的设计之三:业务接口+UI层的设计(基于Castle实现的Repository)
Repository层设计的文章见:[http://www.cnblogs.com/yomho/p/3297042.html] 一.概要设计 上面Reposity 应该为 Repository 特 ...
- EasyUI实现异步加载tree(整合Struts2)
首先jsp页面有一ul用于展现Tree <ul id="mytree"></ul> 加载Tree <script type="text/ja ...