JQuery验证多个文件

时间:2013-02-12 07:06:32

标签: javascript jquery file-upload

您好我要上传多个文件,我需要在提交表单之前验证所有这些

<form onsubmit="return validate()">
<input type="file" name="File" class="multi" />
<input type="file" name="File" class="multi" />
<input type="file" name="File" class="multi" />
<input type="file" name="File" class="multi" />
<input type="submit" name="BtnSubmit" value="save" />
</form>

和j查询部分

function validate()
{
$(".multi").each(function(){
   var files = $(this).val(); 

   if(files=='')
   { 
      alert("No document file selected");
       return false; 
   }

});
}

问题是它显示警报但仍然提交表单。如何防止这种情况。?

3 个答案:

答案 0 :(得分:0)

从表单的onsubmit处理程序返回false会停止提交过程,但是在您的代码中,您将从您提供给false的匿名函数返回$.each而不是validate 1}}功能。

答案 1 :(得分:0)

试试这个小提琴http://jsfiddle.net/6cU74/3/

HTML: -

<form id="form1" method="post">
    <input type="file" name="File" class="multi" />
    <input type="file" name="File" class="multi" />
    <input type="file" name="File" class="multi" />
    <input type="file" name="File" class="multi" />
    <input type="submit" id="BtnSubmit" value="save" />
</form>

JS(使用jQuery): -

$(function () {
    $("#BtnSubmit").click(function (event) {
        event.preventDefault();
        var flag = true;
        $(".multi").each(function () {
            var files = $(this).val();

            if (files == '') {
                alert("No document file selected");
                flag=false;
            }

        });
        if (true==flag){
            $("#form1").submit();
            }
    });
});

答案 2 :(得分:0)

validate函数不返回false,但.each()函数是。因此,添加验证以检查是否所有验证都在.each()函数中传递,否则返回false

function validate() {
    var count = $(".multi").length;
    var index = 0;
    $(".multi").each(function () {
        var files = $(this).val();

        if (files == '') {
            alert("No document file selected");
            return false;
        }

        index += 1;
    });

    if (index != count) { //If the validation in .each() looping has returned false
        return false;
    }
}