問題
如何判斷input file表單里上傳的圖片的寬高和大小呢？
解決方案
這個時候圖片還沒真正上傳，也不是在頁面上展示，不能使用$(“#id”).width(),$(“#id”).height()這種方式。
在Stack Overflow找到一個方法獲取input file圖片文件的寬高：
var _URL = window.URL || window.webkitURL;$("#file").change(function (e) { var file, img; if ((file = this.files[0])) { img = new Image(); img.onload = function () { alert(this.width + " " + this.height); }; img.src = _URL.createObjectURL(file); }});發現可以用，僅在火狐中測試了，其他瀏覽器兼容性未知，因為后臺使用，所以暫且不管兼容性，拿來封裝了一下。
我把這個函數完善了一下，獲取input file圖片的寬高和大小，如下：
//獲取input圖片寬高和大小function getImageWidthAndHeight(id, callback) { var _URL = window.URL || window.webkitURL; $("#" + id).change(function (e) { var file, img; if ((file = this.files[0])) { img = new Image(); img.onload = function () { callback && callback({"width": this.width, "height": this.height, "filesize": file.size}); }; img.src = _URL.createObjectURL(file); } });}這里使用了一個回調方法，回調方法的參數是這個json對象，包含寬度、高度和大小，在jQuery中這樣調用：
(function () { //省略其他代碼 getImageWidthAndHeight('image_file', function (obj) { if (obj.width != 843 || obj.height != 1038) { $.messager.alert('操作提示', '彈窗圖片寬高必須是843*1038px'); } });})(jQuery)好了，這樣就OK了。以上就是jQuery獲取intput file圖片的寬高和大小的全部內容了，相信本文的內容會對大家平時使用jQuery和圖片上傳的時候很有幫助的。
新聞熱點
疑難解答
