js 控制 上传文件的大小和类型

做的一个文件上传的demo
注意的是 文件大小的单位是 字节 也就是 kb
如果说 最大文件的大小是5MB 那么就需要单位换算
1 MB =1024 KB
1 KB = 1024B

// html部分
<form id="uploadForm">
    <input type="file" onchange="fileChange(this)" id="upLoad">
    <p id="error-msg"></p>
    <input type="button" value="上传" id="submit">
</form>
//js部分
function fileChange(target){

            var fileEnd = filePath.substring(filePath.lastIndexOf('.'))
            for(var i=0;i<fileTypes.length;i++){
                if(fileEnd == fileTypes[i]){
                    bNext = true;
                    msgTxt.innerHTML = '';
                    break;
                }
            };
            if(!bNext){
                msgTxt.innerHTML = '文件类型不正确';
                target.value = '';
                return false;
            }
        }
        fileSize = document.getElementById('upLoad').files[0].size;


            if(fileSize>fileMaxSize){
                msgTxt.innerHTML = '文件最大不能超过 5M';
                target.value = '';
                return false;
            }else if(fileSize<=0){
                msgTxt.innerHTML = '文件不得小于 0M';
                target.value = '';
                return false;
            }
        }


        //上传 提交
        document.getElementById('submit').onclick = function(){
                if(document.getElementById('upLoad').value==''){
                    return false;   //如果上传文件为空,那么就不向后台发请求
                }
               var formData = new FormData(document.getElementById("uploadForm"));
            $.ajax({
                   url: '......' ,
                   type: 'POST',
                   data: formData,
                   async: false,
                   cache: false,
                   contentType: false,
                   processData: false,
                   success: function (response) {
                       alert(response);
                   },
                   error: function (response) {
                       alert(response);
                   }
               });
        }
  • 1
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 2
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值