使用多个文件输入时如何限制选择的最大文件数

Question

使用<input type="file" multiple>时，用户可以选择多个文件。一个如何限制可以选择的文件数限制，例如两个？

Answer 1

如果文件数大于max_file_number，这应该起作用并保护您的表单不被提交。

$(function() {

  var // Define maximum number of files.

      max_file_number = 3,

      // Define your form id or class or just tag.

      $form = $('form'), 

      // Define your upload field class or id or tag.

      $file_upload = $('#image_upload', $form), 

      // Define your submit class or id or tag.

      $button = $('.submit', $form); 

  // Disable submit button on page ready.

  $button.prop('disabled', 'disabled');

  $file_upload.on('change', function () {

    var number_of_images = $(this)[0].files.length;

    if (number_of_images > max_file_number) {

      alert(`You can upload maximum ${max_file_number} files.`);

      $(this).val('');

      $button.prop('disabled', 'disabled');

    } else {

      $button.prop('disabled', false);

    }

  });

});