如何使用jquery插件驗證上傳的文件？

這裏是我的代碼：

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> 
<script src="https://raw.github.com/jzaefferer/jquery-validation/master/jquery.validate.js"></script> 
<script src="https://raw.github.com/jzaefferer/jquery-validation/master/additional-methods.js"></script> 
<script> 
      jQuery(document).ready(function($){ 
       $("#subsciptionForm").validate({ 
        rules: { 
         headshot: { 
          required: true, 
          accept: "jpg,png,jpeg,gif" 
         }, 
         actorcv: { 
          required: true, 
          accept: "application/msword, application/pdf" 
         } 
        }, 
        messages: { 
         headshot: { 
          required: 'Select an image to upload', 
          accept: 'Only images with type jpg/png/jpeg/gif are allowed' 
         }, 
         actorcv: { 
          required: "Select a CV", 
          accept: 'Only doc/docx/pdf files are allowed' 
         } 
        }, 
        submitHandler: function(form) { 
         //form.submit(); 
         var url = '<?php echo SET_SUBSCRIBER; ?>'; 
         var datastring = $("form").serialize(); 
         alert(datastring); return false;    
         $.ajax({ 
          type: "POST", 
          url: url, 
          data: datastring, 
          success: function(data) { 
           //alert(data); return false; 
           form.submit(); 
          } 
         }); 
         return false; 
        } 
       }); 
      }); 
     </script>

這裏是表單字段

     <!-- Upload Headshot --> 
        <tr>    
         <td class="title_cell" width="23%"> 
          Upload Headshot :<span class="required">*</span> 
         </td> 
         <td class="field_cell"> 
          <input type="file" class="required" name="headshot" size="25"> (jpg, gif or png only, with maximum 1MB size) 
         </td> 
        </tr> 
        <!-- Upload Actor's CV --> 
        <tr>    
         <td class="title_cell" width="23%"> 
          Upload Actor's CV :<span class="required">*</span> 
         </td> 
         <td class="field_cell"> 
          <input type="file" class="required" name="actorcv" size="25"> (MS-word or PDF only, with maximum 1MB size) 
         </td> 
        </tr>

它的工作原理與以圖像文件的驗證，但不驗證PDF和DOC文件。繼續給我在消息「Only doc/docx/pdf files are allowed」中定義的相同消息。此外，我得到這個控制檯：

TypeError: b.browser is undefined

編輯：

的類型錯誤在評論凱文乙幫助後，走了，但現在還沒有驗證PDF文件。任何想法？

來源

2013-04-12 atif

b.browser未定義是從使用未被更新的jQuery插件1.9 –

jquery的鏈路是不正確，它應該是'<腳本類型=「文本/ JavaScript的「src =」http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js「>'--------'http：'missing –

@MohammadAdil There's離開'http：'沒有任何問題。 –

The accept rule is for validating by mime-type。

如果您嘗試通過文件擴展名進行驗證，則需要使用extension規則。

參見：http://docs.jquery.com/Plugins/Validation/CustomMethods/extension#extension

rules: { 
    headshot: { 
     required: true, 
     extension: "jpg,png,jpeg,gif" 
    }, 
    actorcv: { 
     required: true, 
     accept: "application/msword, application/pdf" 
    } 
},

來源

2013-04-17 04:20:39 Sparky

圖像很好地驗證了，但是word文檔和pdf文件沒有驗證，我認爲你應該改變actor的「接受」。說' – atif

@atif，如何組裝你的項目真的取決於你，我只是解釋'accept'和'extension'規則之間的區別。 – Sparky

@atif，是的，爲什麼不試試你的兩個字段都帶'extension '規則。 – Sparky

如何使用jquery插件驗證上傳的文件？

回答

相關問題