JavaScript校验图片格式及大小

<!DOCTYPE html>

<html>

<head>

<title>JavaScript校验图片格式及大小</title>

<script type="text/javascript">

var isIE = /msie/i.test(navigator.userAgent) && !window.opera;

function fileChange(target,id) {

var fileSize = 0;// 图片大小

var filetypes =[".jpg",".png"];// 图片类型

var filepath = target.value;// 图片路径

var filemaxsize = 1024*10;// 图片最大10M

 

if(filepath){

var isnext = false;

var fileend = filepath.substring(filepath.indexOf("."));

if(filetypes && filetypes.length>0){

for(var i =0; i<filetypes.length;i++){

if(filetypes[i]==fileend){

isnext = true;

break;

}

}

}

if(!isnext){

alert("不接受此图片类型");

target.value ="";

return false;

}

}else{

return false;

}

if (isIE && !target.files) {

var filePath = target.value;

 

var fileSystem = new ActiveXObject("Scripting.FileSystemObject");

if(!fileSystem.FileExists(filePath)){

alert("图片不存在,请重新输入");

return false;

}

var file = fileSystem.GetFile (filePath);

fileSize = file.Size;

} else {

fileSize = target.files[0].size;

}

var size = fileSize / 1024;

if(size > filemaxsize){

alert("图片大小不能超过10M");

target.value ="";

return false;

}

if(size<=0){

alert("图片大小不能为0M");

target.value ="";

return false;

}

 

// 上传图片到服务器

var path = '/img/year/';

$.ajaxFileUpload({

url:'${contextPath}/do/file/uploadFile/?path='+path,

secureuri:false,

fileElementId:'fileuploade',

dataType: 'json',

success: function (data, status){

var path = data.path;

var imgHost = data.imgHost;

$("#img_file").css("display","block");

$("#tempimg").attr("src",imgHost+path);

$("#add_img_url").val(path);

},

error: function (data, status, e){

$.messager.alert('操作提示', '上传失败!');

}

});

}

</script>

</head>

<body>

  <input type="file" id="fileuploade" name="file_path" οnchange="fileChange(this);">

</body>

转载于:https://www.cnblogs.com/df-xfz/p/5893578.html

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值