您的位置:首页 > Web前端 > JQuery

jquery控制上传文件格式、大小以及图片预览功能

2017-10-05 10:47 567 查看
通过jquery控制上传文件的格式、大小;当选择图片时,能在页面上提供图片预览的功能。
$("#picture").change(function () {
var s = $('#picture').val();
var start = s.indexOf(".") + 1;
var name = s.substring(start, s.length).toLowerCase();
if (name != "jpg" && name != "png" && name != "gif") {
alert("图片格式必须为jpg、png、gif中的一种");
$("[value='上传']").attr("disabled", true);
return;
}
if (this.files[0].size / 1024 / 1024 > 5) {
alert("图片不能超过5M");
$("[value='上传']").attr("disabled", true);
return;
}
var objUrl = getObjectURL(this.files[0]);
if (objUrl) {
$("#img0").attr("src", objUrl);
}
$("[value='上传']").attr("disabled", false);
});

//获得file按钮选取文件的路径
function getObjectURL(file) {
var url = null;
if (window.createObjectURL != undefined) { // basic
url = window.createObjectURL(file);
} else if (window.URL != undefined) { // mozilla(firefox)
url = window.URL.createObjectURL(file);
} else if (window.webkitURL != undefined) { // webkit or chrome
url = window.webkitURL.createObjectURL(file);
}
return url;
}
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签:  jquery 文件上传
相关文章推荐