為了保持程式碼的規格，以及大小，專門寫的js，用於前臺預覽圖片的時候，進行圖片的限制。
邏輯是這樣的，1、點選圖片上傳（input標籤） 2、js會先判定圖片是否同時滿足高寬，大小
3、對於不滿足條件的圖片，將會清空input標籤，以及預覽的div的內容。
4、滿足條件的不作任何操作，後就可以上傳。

js程式碼：

    //判斷瀏覽器是否支援FileReader介面
    if (typeof FileReader == 'undefined') {
        document.getElementById("#id01").InnerHTML = "<h1>當前瀏覽器不支援FileReader介面</h1>"
 
;
        //使選擇控制元件不可操作
        document.getElementById("#id02").setAttribute("disabled", "disabled");
    }
    //選擇圖片，馬上預覽
    function loadImg(obj) {
        var file = obj.files[0];
        var reader = new FileReader();
        //讀取檔案過程方法
         reader.onloadstart = function (e) {
            console.log("開始讀取...."
 
);
        }
        reader.onprogress = function (e) {
            console.log("正在讀取中....");
        }
        reader.onabort = function (e) {
            console.log("中斷讀取....");
        }
        reader.onerror = function (e) {
            console.log("讀取異常....");
        } 
        reader.onload = function
 
 (e) {
            var img = document.getElementById("#id01");
            img.src = e.target.result;
            img.onload = function () {
                if(img.width!=800&&img.height!=600){
    alert('當前圖片不符合規範'+'width:'+img.width+',height:'+img.height+'size:'+e.loaded); 
                  //下面兩句，清空input資料夾的快取
                    var obj = document.getElementById('#input-type-file的id') ; 
                     obj.outerHTML=obj.outerHTML; 
                    img.src = ''; //不符合要求，清空圖片資料
                     return ;//中斷執行過程
                  }
            };
        }
        reader.readAsDataURL(file)
    }

html程式碼：
僅作參考

<input type="file" id="#input-type-file的id" onchange="loadImg(this)" accept="image/gif,image/jpeg,image/jpg,image/png"/></p>
<img id="#id01"/><div id="#id02"></div></div></div>