JQuery验证文件输入

时间:2013-02-11 14:29:03

标签: jquery file-upload validation

您好我需要验证file输入类型:

<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 :(得分:1)

function validate(){
  $(".multi").each(function(){
   var files = $(this).val(); 
   if(files==''){ 
     alert("No document file selected"); 
   }
   return false;       
 });
}

如果阻止,你的return语句应该在不同的块中不相同,所以它将起作用

答案 1 :(得分:1)

请参阅下面的代码段,以验证提交的文件是否为有效的文件类型。以及检查文件是否已提交以开始。

//Javascript

$("#btnUpload").click(function (e) {

        var file = $("#fileupload").val();  //Fetch the filename of the submitted file

        if (file == '') {    //Check if a file was selected
            //Place warning text below the upload control
            $(".errorDiv").html("Please select a file first.");
            e.preventDefault();
        }
        else {
            //Check file extension
            var ext = file.split('.').pop().toLowerCase();   //Check file extension if valid or expected
            if ($.inArray(ext, ['txt']) == -1) {
                $(".errorDiv").html("Select valid text file (txt).");
                e.preventDefault(); //Prevent submission of form
            }
            else {
        //Do your logic here, file upload, stream. etc.. if file was successfully validated
        }
    }
});

//对于HTML

<input id="fileupload"     type="file" name="files[]" /><br />
                    <p class="reminder"> Allowed file type: .txt</p>
                    <div class="errorDiv"></div>
                    <input type="button" id="btnUpload" value="Upload File"/><br />

抬头:在服务器端执行文件验证,以防止后端错误或数据注入。

我希望这有帮助!

答案 2 :(得分:0)

问题是,你为每个循环返回false。如果在$.each()循环内返回false,则表示退出$.each循环。所以这里会出现警报,然后就会退出每个警报。

您可以通过多种方式完成该任务。但最简单的方法是带一个标志变量。

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

        if(files=='') { 
           alert("No document file selected");
           $check = false;
           return false; // You don't want to loop, so exit each loop
        }
    });

    return $check;
}