验证输入类型=文件

时间:2014-08-01 05:01:27

标签: jquery html

如何使用jQuery在点击上传按钮时验证用户是否选择了图像。我可以限制上传图像的分辨率吗?例如: - 仅允许分辨率高于900 x 400的图像。 以下是我使用

的表格
<form id='eventImage' action='upload_temp_image.php' method='POST' enctype='multipart/form-data'>
<input type='text' class='form-control' name='image_name' id='image_name'/>
<input type='file' name='event_image' id='event_image' />
<input type='submit' name='upload' value='Upload' />
</form>

以下是jQuery:

$("#eventImage").validate({
        rules: {
            image_name: {
                required : true
            },
            // validate the input type=file 
        },

        image_name: {
            new_name: "Please enter a Category name!",
            event_image: "Please select an image"
        }
  });

2 个答案:

答案 0 :(得分:1)

查看extension rule

$("#eventImage").validate({
    rules: {
        image_name: {
            required: true
        },
        event_image: {
            required: true,
            extension: "png|jpg"
        }
    },
    messages: {
        event_image: {
            extension: "Please select an image"
        }
    }
});

演示:Fiddle

或者如果您想使用mimetype,请查看accept rule

$("#eventImage").validate({
    rules: {
        image_name: {
            required: true
        },
        event_image: {
            required: true,
            accept: "image/*"
        }
    },
    messages: {
        event_image: {
            accept: "Please select an image"
        }
    }
});

演示:Fiddle

答案 1 :(得分:0)

嘿,我不知道人们是否仍然遇到这个问题,但是如果您希望用户仅上传图像,而没有其他任何东西,只需在accept="image/*"之后添加<input type="file"即可。

无需为此添加jquery。