jquery 유효성 검사를 사용하여 픽셀 단위로 유효성 검사 치수를 추가하려면 어떻게해야합니까?

Question

내 JQuery와는 다음과 같이 확인 :

Please upload an image with 1170 x 300 pixels dimension

내가 어떻게 작업을 수행 할 수 있습니다

store: { 
    rules: { 
     banner: { 
      required: true 
     } 
    }, 
    messages: { 
     banner: 'The banner must be filled', 
    }, 
    errorElement: 'span', 
    errorPlacement: errorPlacement, 
    highlight: highlight, 
    unhighlight: unhighlight 
}, 

사용자는 1170 X 300 픽셀이 같은 메시지가 존재하는 차원과 배너를 업로드 할 경우?

Answer 1

당신은 사용자 정의 검증 방법

$.validator.addMethod('dimention', function(value, element, param) { 
    if(element.files.length == 0){ 
     return true; <--- check here if file not added than return true for not check file dimention 
    } 
    var width = $(element).data('imageWidth'); 
    var height = $(element).data('imageHeight'); 
    if(width == param[0] && height == param[1]){ 
     return true; 
    }else{ 
     return false; 
    } 
},'Please upload an image with 1170 x 300 pixels dimension'); 

을 작성해야합니다 그리고 당신은이

// files is id of your input

<input type="file" id="files" name="name" /> 

$('#files').change(function() { 
    $('#files').removeData('imageWidth'); 
    $('#files').removeData('imageHeight'); 
    var file = this.files[0]; 
    var tmpImg = new Image(); 
    tmpImg.src=window.URL.createObjectURL(file); 
    tmpImg.onload = function() { 
     width = tmpImg.naturalWidth, 
     height = tmpImg.naturalHeight; 
     $('#files').data('imageWidth', width); 
     $('#files').data('imageHeight', height); 
    } 
}); 

같은 이미지 변화에 매개 변수 IMAGEWIDTH 및 imageHeight을 설정하고 같이 호출 할 필요가 이

확인

rules: { 
    banner: { 
     dimention:[1170,300] 
    } 
} 

`jQuery.validator.addMethod`를 사용하여 바이올린 링크 fiddle link