2012-04-11 492 views
29

我想上傳2個項目。 如何限制上的多個輸入文件的最大項目如何限制多個輸入上的最大項目(<input type =「file」multiple />)

+1

這可能會有所幫助: http://stackoverflow.com/questions/9813556/multiple-file-upload-file-input -limit-number-of-files – 2012-04-11 11:59:29

+0

[Count並限制上傳的文件數(HTML文件輸入)]的可能重複](https://stackoverflow.com/questions/9813556/count-and-limit-the-number- of-files-uploaded-html-file-input) – gbjbaanb 2017-06-27 16:13:20

回答

33

你可以運行一些jQuery的客戶端驗證檢查:

$(function(){ 
    $("input[type='submit']").click(function(){ 
     var $fileUpload = $("input[type='file']"); 
     if (parseInt($fileUpload.get(0).files.length)>2){ 
     alert("You can only upload a maximum of 2 files"); 
     } 
    });  
});​ 

http://jsfiddle.net/Curt/u4NuH/

但記住一定要在服務器端也爲客戶端驗證可以很容易地繞過。

+0

這是可能的形式/輸入本身? – Wanjia 2017-07-11 15:03:25

-3

改爲使用兩個<input type=file>元素,而不使用multiple屬性。

+1

這將只允許一個圖像,他想要2個圖像 – Diego 2016-10-15 21:36:54

+2

不允許,這允許兩個單獨的文件列表對象,並一直用作上傳多個文件並限制它們的數量的方法--- 15年前 – 2017-09-27 16:09:08

4
<strong>On change of the input track how many files are selected:</strong> 

<script> 
    $("#image").on("change", function() { 
     if($("#image")[0].files.length > 2) { 
        alert("You can select only 2 images"); 
     } else { 
       $("#imageUploadForm").submit(); 
     } 
    }); 
</script> 
<input name="image[]" id="image" type="file" multiple="multiple" accept="image/jpg, image/jpeg" > 
+1

注意後面的僞分號if條件。 – Qdeep 2017-01-07 21:05:39

相關問題