input做图片上传限制图片大小1M以内

input 属性type=file;定义输入字段和 "浏览"按钮，供文件上传。
1、做图片上传可配合中使用 accept 属性来限制图片的格式。

注意 accept 属性只能与 配合使用。

<input type="file" name="pic" id="pic" accept="image/gif, image/jpeg" onchange="upLoad('pic')"/>

本例中的输入字段可以接受 GIF 和 JPEG 两种图像.

如果不限制图像的格式，可以写为：accept=“image/*”。

name 和id 是必须要写的。

2、获得input type=“file” 选择的文件大小、文件名称、上次修改时间、类型等信息（*多个文件会存储在files数组中）这里是引入ajaxfileupload.js配合完成的；

function upLoad(id) {
       
  var f = document.getElementById(id).files;  
  //上次修改时间  
  console.log(f[0].lastModifiedDate);  
  //名称  
  console.log(f[0].name);  
  //类型  
  console.log(f[0].type);
  //大小 字节  
  console.log(f[0].size);
  //这里做图片大小限制   
  if(f[0].size/1024>1024){
     
          alert('上传图片不能大于1M');
          return;
      }
    $.ajaxFileUpload({
     
    //上传图片的地址配合后提供的接口
        url: 'index.php?c=do&a='',
        type: 'post',
        secureuri: false, //一般设置为false
        // fileElementId上传文件的id、name属性名
        fileElementId: id, 
        //返回值类型，一般设置为json、application/json
        dataType: 'json', 
        async: false,
        success: function(data, status){
     
        //上传成功函数返回的是图片在服务器上的路径url可以直接访问
         if( data && data.result == 0 ){
     
          console.log(data.url）
          }
        },
        error: function(data, status, e){
     
            alert('上传失败');
        }
    });  
 } 

也可以根据图片的后缀进行文件类型的判断，js如下

var type=(src.substr(src.lastIndexOf("."))).toLowerCase();
  if(type!=".jpg"&&type!=".gif"&&type!=".jpeg"&& type!=".png"){
     
  alert("您上传图片的类型不符合(.jpg|.jpeg|.gif|.png)！");
}