zoukankan      html  css  js  c++  java
  • js判断上传文件的大小

    HTML:

    <form action="http://www.baidu.com" id="form">
            <img id="tempimg" dynsrc="logo.png" src=""  />
            <input type="file" name="file" id="fileuploade" size="40" />
            <input type="button" id="check" name ="check" value="checkfilesize" />
            <input type="submit" style="120px;" id="submit1" value="提交" />
        </form>

    JS:

      var obj_file = document.getElementById("fileuploade"),
            check = $("#check"),
            sub = $("#submit1");
    
        var flag = false;
    
        function checkfile(obj_file, maxsize){
             var filesize = 0;
    
             if(obj_file.files){
                filesize = obj_file.files[0].size;
             }else{
                  var obj_img = document.getElementById('tempimg'),
                      obj_img.dynsrc = obj_file.value,
                      filesize = obj_img.fileSize;
             }
    
             if(filesize == -1){
                 flag = false;
                 console.log("有错误");
             }else if(filesize > maxsize){
                 flag = false;
                  console.log("超过10k啦");
            }else{
                  flag = true;
                 console.log("文件大小符合要求");
            }
    
          }
    
          check.click(function(){
              checkfile(obj_file, 100000);
          });
    
          sub.click(function(e){
              //e.preventDefault();
              if(!flag){
                  return false;
              }
          });

    说明

      1. 现代浏览器支持 obj_file.files, IE9876不支持,所以获取图片兼容

      2. 图片的 dynsrc http://www.w3school.com.cn/media/media_browservideos.asp   dynsrc 属性不是标准的 HTML 或 XHTML 元素。仅有 Internet Explorer 支持该属性。

      3. 阻止表单提交 可以 return false; 也可以 e.preventDefault();

  • 相关阅读:
    GitHub Android Libraries Top 100 简介
    GitHub Top 100 的项目(iOS)
    iOS 学习资源
    HTTP和GET/POST请求(NSURLConnection)
    RunLoop
    HTML5 拖放
    网络安全与加密
    Cocoapods的安装
    iOS中的单例模式
    SDWebImage
  • 原文地址:https://www.cnblogs.com/chuyu/p/3507550.html
Copyright © 2011-2022 走看看