使用jQuery驗證插件的圖片維度規則

Question

是否可以使用jQuery驗證插件指定圖片維度規則？例如，假設我希望上傳的圖片的寬度至少爲600px。有沒有可能爲此設置一個規則？如果是這樣，一個人如何實現它？

Answer 1

你可以提交表單前進行覈實：

window.URL = window.URL || window.webkitURL; 

    $("form").submit(function(e) { 
     var form = this; 
     e.preventDefault(); //Stop the submit for now 
            //Replace with your selector to find the file input in your form 
     var fileInput = $(this).find("input[type=file]")[0], 
      file = fileInput.files && fileInput.files[0]; 

     if(file) { 
      var img = new Image(); 

      img.src = window.URL.createObjectURL(file); 

      img.onload = function() { 
       var width = img.naturalWidth, 
        height = img.naturalHeight; 

       window.URL.revokeObjectURL(img.src); 

       if(width == 400 && height == 300) { 
        form.submit(); 
       } 
       else { 
        //fail 
       } 
      }; 
     } 
     else { //No file was input or browser doesn't support client side reading 
      form.submit(); 
     } 

    });