表单验证-----验证图片格式

表单验证-----验证图片格式

今天在学习表单验证过程中，又学习了文件类型验证，主要验证文件的格式、大小等属性，方便表单提交。
在使用验证的过程中，get到了一个重要的test()方法，主要用来验证对象中是否含有某字符或数字，例如object.test(String),即验证对象中是否含有字符串。
具体代码如下：

/** * 10、验证图片 必须图片格式，<=3M * @returns {boolean} */function validPic() 
{  let pic = document.getElementById("pic");  
let span = pic.nextElementSibling;  span.innerHTML = "";  span.style.color = "red";  
//文件列表  let fileList = pic.files;
  //判空  if (!fileList || fileList.length === 0) { 
     span.innerHTML = "头像不能为空";    return false;  }
       //判断数据类型  let reg = /^jpg|png|jepg|bmp|webp|gif$/;  
       for (let i = 0; i < fileList.length; i++) {  
         let file = fileList[i];   
          console.log(file);    
          let fileName = file.name;    
          //文件大小 字节    
          let size = file.size;    
          //文件后缀    
          let suffix = fileName.substring(fileName.lastIndexOf(".") + 1);  
            if (!reg.test(suffix)) {     
             span.innerHTML = "头像必须是图片";      return false;    }    
             //文件不能超3MB    
             if (size > 300 * 1024 * 1024) {
                   span.innerHTML = "头像大小不能超过300kb";      return false;   
                    }  }  
                    span.innerHTML = "头像正确";
                      span.style.color = "green";  return true;}
                      以下是函数调用：
                      //窗口资源加载结束执行的操作
                      onload = function () {
                      //验证头像  
                      let pic = document.getElementById("pic");  
                      pic.onchange = function () {    validPic();  };