Javascript 使用文件上载最大大小事件的代码转换为简单代码

我是jquery/javascript新手，现在我有了一个表单，用户可以上传多个文件，这很好，但我需要对其进行修改。这是工作代码

$('#userFiles').change(function() {
  var combinedSize = 0;
  for (var i = 0; i < this.files.length; i++) {
    combinedSize += (this.files[i].size || this.files[i].fileSize);
  }
  if (combinedSize > 104857600) {
    toastr["error"]("Max upload size is 100MB");
  }
});

$（'#userFiles'）。更改（函数（）{
var combinedSize=0；
对于（var i=0；i104857600）{
toastr[“错误]（“最大上载大小为100MB”）；
}
});

HTML

现在我想做的是，在提交检查之前，检查集合文件大小是否超过100如果是，则停止表单提交，并显示一个错误，您无法上载超过100MB的内容。这是更新的代码

$("form").on("submit", function(e) {
  e.preventDefault();

  $('#userFiles').change(function() {
    var combinedSize = 0;
    for (var i = 0; i < this.files.length; i++) {
      combinedSize += (this.files[i].size || this.files[i].fileSize);
    }
    if (combinedSize > 104857600) {
      toastr["error"]("Max upload size is 100MB");
    }
  });
});

$（“表格”）。关于（“提交”，函数（e）{
e、 预防默认值（）；
$（'#userFiles'）.change（函数（）{
var combinedSize=0；
对于（var i=0；i104857600）{
toastr[“错误]（“最大上载大小为100MB”）；
}
});
});

我的问题是它使用了这个函数，因为它是一个用于输入更改的事件，当涉及表单提交时，我不能在其中使用另一个事件我希望逻辑仅用于表单提交如何用userFile id属性替换这个？我尝试了几种方法，但都不起作用。

函数validateMaxFileSize（）{
//从元素中取出文件
var files=$（'#userFiles'）.prop（'files'）；
var combinedSize=0；
对于（var i=0；i104857600）；
}
$（'#userFiles'）.change（函数（）{
//如果超过最大值，则显示烤面包机
if（validateMaxFileSize（））{
toastr[“错误]（“最大上载大小为100MB”）；
}
});
$（“表格”）。关于（“提交”，职能部门（e）{
//如果超过最大值，请取消提交
if（validateMaxFileSize（））{
e、 预防默认值（）；
toastr[“错误]（“最大上载大小为100MB”）；
}
});
如果我理解正确，您可以使用全局变量来执行此操作。e、 g

var combinedSize = 0;

$('#userFiles').change(function() {
    combinedSize = 0;
    for (var i = 0; i < this.files.length; i++) {
      combinedSize += (this.files[i].size || this.files[i].fileSize);
    }

  });

$("form").on("submit", function(e) {


   if (combinedSize > 104857600){
    e.preventDefault();
    toastr["error"]("Max upload size is 100MB");
   }

});

var combinedSize=0；
$（'#userFiles'）.change（函数（）{
组合大小=0；
对于（var i=0；i104857600）{
e、 预防默认值（）；
toastr[“错误]（“最大上载大小为100MB”）；
}
});

请记住，这只是客户端验证，还不够！如果用户broswer禁用了javascript，会发生什么？表格仍将提交，文件将通过。您需要进行服务器端验证，以确保它们不会超过文件限制。您可以在配置文件中设置最大文件请求大小的值。如果您有asp.net应用程序，则可以使用web.config。您还可以在服务器代码中检查文件大小是否过大并返回验证消息。
您应该避免在其他事件处理程序中创建事件处理程序。这是创建重复绑定的一种很好的方法，它经常会让您陷入问题。是的，这正是我正在尝试的。由于事件，循环实际上使用了此变量。我如何才能传递输入类型文件而不是此文件？将其添加到您的问题中，而不是作为注释。进一步问题。为什么要在提交处理程序中创建更改绑定？为什么不抓取文件并进行检查呢？我想验证的是，如果所有文件的大小都大于100，则应显示实际上载文件的输入类型。您还应在服务器端执行文件大小检查，因为用户总是可以破坏您的javascript@uneebmeeryes php部分已经在后端工作了，我只是想最好停止客户端的某些用户，以节省服务器上的额外负载：）dully注意到：）
var combinedSize = 0;

$('#userFiles').change(function() {
    combinedSize = 0;
    for (var i = 0; i < this.files.length; i++) {
      combinedSize += (this.files[i].size || this.files[i].fileSize);
    }

  });

$("form").on("submit", function(e) {


   if (combinedSize > 104857600){
    e.preventDefault();
    toastr["error"]("Max upload size is 100MB");
   }

});