未捕获的DOMException：无法在'FileReader'上执行'readAsDataURL'：该对象已在忙于读取Blob

Question

我的问题是我将图像拖放到网站页面上到独立的放置位置。每个放置位置都有自己的唯一ID。如果您将倍数拖动到第一个位置，则效果很好。但是，如果您尝试将它们拖到第二个位置，则FileReader会说它繁忙且出错。

我一直在搜索此网站，谷歌以及jquery和FileReader文档。我找不到答案。我认为我正在使用代理的事实导致它永远不会关闭。

所以我的问题是如何在每次下降后关闭它，或者如何修复它以使其自身闭合。

$(document).on('dragover dragenter', '.imagedroppable', function(e){
      thisVal = this;
      e.preventDefault();
      e.stopPropagation();
    }).on('drop', $(this).attr('id'), function(e, ui){

      var dataTransfer = e.originalEvent.dataTransfer;
      if (dataTransfer && dataTransfer.files.length) {
        e.preventDefault();
        e.stopPropagation();

        $.each(dataTransfer.files, function(i, file) {
        // Make sure `file.name` matches our extensions criteria
            if ( /\.(jpe?g|png|gif)$/i.test(file.name) ) {
                (function(file) {
                  var reader = new FileReader();
                  reader.onload = $.proxy(
                                    function(file, $fileList, event) {
                                        nr++;
                                        var img = file.type.match('image.*') ? "<img  id=\"resizable"+nr+"\" class=\"resizable\" src='" + event.target.result + "' /> " : "";
                                        $(thisVal).find($fileList).prepend($("<span>").append(img));
                                        setResizable("resizable"+nr);
                                      }, this, file, $("#fileList"));
                  reader.readAsDataURL(file);
                })(file);
            }
        });
      }
     // Build check for if its dropping on an image spot
     $(this).find(".imageinfo").remove();

  });

});