如何使用jquery验证以像素为单位添加验证维度?

时间:2017-11-29 07:47:23

标签: javascript jquery jquery-validate

我的jquery验证如下:

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

如果用户没有上传尺寸为1170 x 300像素的横幅,则会出现如下消息:

  

请上传尺寸为1170 x 300像素的图片

我该怎么做?

1 个答案:

答案 0 :(得分:3)

您需要创建自定义验证方法

sqlconnect()
sqltable = New DataTable
sqladapter = New SqlDataAdapter("SELECT * FROM AIRBILLS WHERE AirbillNo = '" & "123456" & "'",sqlcon)
sqladapter.Fill(sqltable)
MsgBox(sqltable.Rows(0)("Addressee"))

你需要在图片更改时设置参数 imageWidth imageHeight

  

// files是输入的id

$.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');

并像这样打电话

<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);
    }
});

工作小提琴链接fiddle link