Warm tip: This article is reproduced from serverfault.com, please click

javascript-如何等待,直到在image.onload事件函数中设置了image.src?

(javascript - How to wait until image.src is set in an image.onload event function?)

发布于 2020-11-23 17:01:59

在我的浏览器Javascript中,对于new image()对象,对于onload事件,在用户选择图像文件后,我首先设置了image.src。然后读取图像对象的大小。

但似乎是在正确设置src之前发生的。我碰巧找到了两次调用该函数的修复程序。但是这种解决方案似乎是一个非常糟糕的主意。

请让我知道如何以标准方式修复它。我的环境接受Typescript。

var imgLoaded=false;
 var file = document.getElementById("fileInput").files[0];
      for(let i=0;i<2;i++){    
          call2(file);
         }
      

   function call2(file) {
      var reader = new FileReader();
      reader.readAsDataURL(file);

      reader.onload = function () {
          if(!imgLoaded){ 
              imgLoaded=true;   img.src=(reader.result).toString();}
         else{
        console.log(img.width);
      }}

Questioner
skatori
Viewed
0
Raya Nasiri 2020-11-30 14:41:48

你可以用一种方式替换 file = document.getElementById("fileInput").files[0];file = event.target.files[0] 并在call2中使用它,也应该将事件传递给call2

例如:先在html:中 <input type="file" onchange="call2(event)" />,然后在js中function call2(e){let file = e.target.files[0] ... }