Question

我正在尝试在bootstrap pop中验证多个accept imput图像扩展。我正在使用按钮类型按钮type="button"，因为submit正在关闭弹出窗口。我正在尝试使用函数验证表单。

代码

<form id="promotionImageForm_<?php echo $row['pm_id']; ?>"  autocomplete="off" enctype="multipart/form-data">
    <label>Add More Images</label>
    <input type="file"  name="pm_image[]" class="form-control" multiple="multiple" id="pmMultiImgs_<?php echo $row['pm_id']; ?>" />
    <button type="button" onclick="return multiUpload(<?php echo $row['pm_id']; ?>);" id="pmMultibTn" />Add</button>
</form>

//JS
    function multiUpload(pmID){
        $('#promotionImageForm_'+pmID).validate({ 
            rules: {
            },
            messages: {
            },
            submitHandler: function (form) {
                alert('Form Submitted');
            }
        });
        /*Multi Images */
        $('#pmMultiImgs_'+pmID).each(function() {
            $(this).rules("add", {
                required: true,
                accept: "image/jpeg, image/pjpeg, image/png",
                messages: {
                    accept: "Only jpeg, jpg or png images"
                }
            });
        });
    }

但是上面的功能什么也没有显示，任何人都可以指导我在哪里错了，我该如何解决它。我想表示感谢。

Answer 1

您的代码的验证部分正在运行：jsfiddle.net/cap6b8m1/

但请注意，.validate()方法用于初始化表单上的插件。因此，根据您的multiUpload()函数中包含的代码，只有在后单击“添加”按钮才会初始化任何内容。

只需从.validate()函数中删除.rules()和multiUpload()方法，这样就可以立即初始化，并将“添加”按钮更改为type="submit"

<button type="submit" id="pmMultibTn">Add</button>

DEMO：jsfiddle.net/qktztesu/

否则，请删除PHP并构建一个自包含的演示，向我们展示实际出现的问题。

使用jquery插件，图像验证不适用于多个接受输入

代码

1 个答案: