jquery输入类型文件验证

时间:2016-01-13 19:37:15

标签: javascript jquery html validation

这是我的html表单。它包含jquery验证插件。我正在尝试验证输入字段类型文件。当我提交表格时,应该检查用户上传图片。

<html>
<head>
<script src="http://code.jquery.com/jquery.min.js"></script>
<script src="http://code.jquery.com/ui/1.11.2/jquery-ui.min.js"></script>
<script type="text/javascript" src="<?php echo $this->config->base_url(); ?>r/js/jquery.validate.js"></script>
<script type="text/javascript" src="http://jqueryvalidation.org/files/dist/additional-methods.min.js"></script>
</head>

<body>
<form role="form" name="add_app_form">
<div class="upload-app-icon">
                    <span>Uplod your App icon here</span>
                    <div class="add-icon"><input type="file" name="app_icon" id="app_icon" ></div>

                </div>
<div class="submit-formbtn">
                    <input class="icon-btn" type="submit" value="Upload">
                </div>
</form>

当我提交表单时,jquery验证不起作用。 我正在使用这个javascript但它无法正常工作

<script type="text/javascript">

    $.validator.addMethod("notEqual", function(value, element, param) {
        return this.optional(element) || value != param;
    });


        $("#add_app_form").validate({

            rules: {
                 app_icon:{
                         required: true,
                         extension: "xls|csv"   
                    } 
            },
            messages: {

                app_icon: "Add icon"
            },
            tooltip_options: {

                app_icon: {placement:'top',html:true}
            }
        });

</script>

1 个答案:

答案 0 :(得分:0)

使用99.9%的用例的accept属性限制元素本身的文件类型。 http://www.w3schools.com/tags/att_input_accept.asp

但是,正如它所指出的,不要将其用于验证/安全目的。所有文件类型/内容验证都应在服务器端完成。