1
我使用Filereader API显示照片上传的小缩略图。但是,我遇到了问题。当你上传真正大的图片,并且你上传了一些图片时,它开始滞后。缩略图非常小,但文件太大。有没有办法来解决这个问题?这是我的javascript:Filereader图像缩略图延迟
document.querySelector('input').addEventListener('change', function(e){
var files = e.target.files;
for(var i = 0; i < files.length; i++){
var f = files[i];
var reader = new FileReader();
reader.onload = (function(tf){
return function(evt){
document.querySelector('.thumbs').innerHTML += '<div class="thumb" style="background-image: url('+evt.target.result+')"></div>';
}
})(f);
reader.readAsDataURL(f);
}
});
这里是一个小提琴,你可以测试它:https://jsfiddle.net/snx79yw2/1/。例如,我用6000x4000的照片测试了它,当超过4,5张时,它们开始滞后(而且我的PC非常不错,所以它不应该像那样落后)。
顺便说一句我指的是减速,冻结等,而不是实际的滞后。
我发现this post但我真的不知道如何从该答案中实现解决方案。 Thx提前!
谢谢,这是伟大的。我有几个问题,但:1)是否可以更改缩放方法(以删除别名)? 2)我不能使用ES6,承诺是否真的是必要的?我如何解决他们? – nick
2)我编辑我的答案使用回调,而不是承诺。 1)可能,但我对图像处理知之甚少,无法在这里找到答案。 –
谢谢,我在这里找到了一个解决方案,所以我要融入这两个! – nick