最小输入文件数

Question

使用<input type="file" multiple>时是否可以要求用户至少输入n个文件？
例如：<input type="file" min=5 multiple>

Answer 1

不，遗憾的是您不能设置用户可以拥有的最小和最大输入量。可能稍后添加，但从 HTML5 开始，不支持此功能。

请参阅 here and here 了解有关如何使用该标签及其功能和限制的文档。

Answer 2

JavaScript 是必需的。添加事件侦听器以侦听输入上的 change 事件，并使用 .files.length.

检查上传文件的数量

var uploader = document.querySelector('input');
var error = document.querySelector('p');
uploader.addEventListener("change", function(){
  if(uploader.files.length < 5){
    error.style.display='block';
  }
})

#error{
  display:none;
  color:red;
}

<input type="file" multiple/>
<p id="error">Please upload at least 5 files</p>

在 form 中使用它来防止上传的文件数量少于 5 个时提交：

var uploader = document.querySelector('input');
var error = document.querySelector('p');
function validate(){
  if(uploader.files.length < 5){
    error.style.display='block';
    return false;
  }
}

#error{
  display:none;
  color:red;
}

<form action="somewhere.php" onsubmit="return validate()">
<input type="file" multiple/>
<p id="error">Please upload at least 5 files</p>
<button>Submit files</button>
</form>

最小输入文件数

Minimum number of files to input

html

file

input-field