进行3次统一检查 - javascript

我有一个包含3个文件输入字段的表单，但是Laravel给了我这个问题：link

因此，我将在发送文件之前进行检查，最大分辨率为2000x2000，我得到了此代码并对其进行了修改，但是由于一个人通过另一个人，所以它仍然出现错误。我想知道如何将3张支票统一为一张。

这是我的代码：

$("#personal").change(function() { 
  var fr = new FileReader;
  fr.onload = function() {
    var imgPersonal = new Image;
    imgPersonal.onload = function() {
      if (imgPersonal.width > 2000 &&  this.height > 2000) {
        $("#submitDocs").attr("disabled", true); 
      } else {
        $("#submitDocs").removeAttr("disabled");
      }
    };
    imgPersonal.src = fr.result;
  };
  fr.readAsDataURL(this.files[0]);
});

$("#self").change(function() { 
  var fr = new FileReader;
  fr.onload = function() {
    var imgSelf = new Image;
    imgPersonal.onload = function() {
      if (imgSelf.width > 2000 &&  this.height > 2000) {
        $("#submitDocs").attr("disabled", true);
      } else {
          $("#submitDocs").removeAttr("disabled");
        }
      }
    };
    imgSelf.src = fr.result;
  };
  fr.readAsDataURL(this.files[0]);
});

$("#address").change(function() { 
  var fr = new FileReader;
  fr.onload = function() {
    var imgAddress = new Image;
    imgPersonal.onload = function() {
      if (imgAddress.width > 2000 &&  this.height > 2000) {
        $("#submitDocs").attr("disabled", true); 
      } else {
          $("#submitDocs").removeAttr("disabled");
        } 
      }
    };
    imgAddress.src = fr.result;
  };
  fr.readAsDataURL(this.files[0]);
});

参考方案

尝试与DRY保持一致，将所有重复的代码放入一个函数中，并保持一个持久对象，该对象检查是否有任何上传的图像无效：

const checks = {
  personal: true,
  self: true,
  address: true,
};

function validate(file, checkAttr) {
  const fr = new FileReader();
  fr.readAsDataURL(file);
  fr.onload = function() {
    const img = new Image();
    img.onload = () => {
      if (img.width > 2000 || img.height > 2000) checks[checkAttr] = true;
      else checks[checkAttr] = false;
      if (checks.personal && checks.self && checks.address) $("#submitDocs").removeAttr("disabled");
      else $("#submitDocs").attr("disabled", true);
    }
    img.src = fr.result;
  }
}

$("#personal").change(function() {
  validate(this.files[0], 'personal');
});

// other handlers

javascript popupwindow之后的行如何工作？ - javascript

好的，我有一个来自后面代码的方法，可以创建一个popupwindow。然后有一行代码要在那之后执行，我想知道那行代码何时执行，是在使用popupwindow之后执行还是在创建popupwindow之后执行？例如：void exPopupWindowMethod() { string scr = "window.open('exampleP…

Javascript-Urls的奇怪字符串比较行为 - javascript

最近，在编写我无法理解的javascript时遇到了字符串比较的问题。我从完全相同的网址创建了两个字符串，当我比较它们时返回false，但是在重新分配相同的字符串后，比较返回true。这是我的示例：var str1 = "http://google.com/"; var str2 = "http://google.com‏/&#…

Javascript-从当前网址中删除查询字符串 - javascript

单击提交按钮后，我需要从网址中删除查询字符串值。我可以用jQuery做到这一点吗？当前网址：siteUrl/page.php?key=value 页面提交后：siteUrl/page.php 实际上，我已经从另一个带有查询字符串的页面着陆到当前页面。我需要在页面首次加载时查询字符串值以预填充一些详细信息。但是，一旦我提交了表格，我就需要删除查询字符串值。我已…

json数组，其中in数组返回错误？坏字符串 - javascript

我将json字符串文件解析为python，并且始终返回error。我使用了在线json格式化程序和验证器，它们也返回错误，因此我需要帮助使我的json正确并告诉我错误 [{ "sentence_id": "TR.00001", "sentence": { "text": …

Mongo汇总 - javascript

我的收藏中有以下文件{ "_id": ObjectId("54490b8104f7142f22ecc97f"), "title": "Sample1", "slug": "samplenews", "cat": …