У меня есть функция с предварительным изменением размера и загрузкой файла ajax. Я вызываю эту функцию в букле FOR в зависимости от размера входного файла. Когда я позвоню это один раз. Работает нормально, но иногда (я не знаю, почему только иногда), когда я вызываю это несколько раз, функция загружает дубликаты изображений. Может быть, для следующего, когда предыдущий еще не закончен и использует тот же холст? Как я могу это исправить? Большое спасибо!
Вот мой код:
...
for (var i = 0; i < filesToUpload.length; i++) {
j=j+1;
preandupload(filesToUpload[i],filesToUpload.length,j);
}
...
function preandupload(file,cuantos,actual){
var dataurl = null;
var img=null;
var canvas=null;
var ctx=null;
// Create an image
img = new Image();
// Create a file reader
var reader = new FileReader();
// Set the image once loaded into file reader
reader.onloadend = function(e)
{
img.src = e.target.result;
img.onload = function () {
var canvas = document.createElement("canvas");
canvas.id = "mycanvas"+actual;
var ctx = canvas.getContext("2d");
ctx.drawImage(img, 0, 0);
var MAX_WIDTH = 1280;
var MAX_HEIGHT = 1280;
var width = img.width;
var height = img.height;
if (width > height) {
if (width > MAX_WIDTH) {
height *= MAX_WIDTH / width;
width = MAX_WIDTH;
}
} else {
if (height > MAX_HEIGHT) {
width *= MAX_HEIGHT / height;
height = MAX_HEIGHT;
}
}
canvas.width = width;
canvas.height = height;
var fd = new FormData();
getOrientation(file, function(orientation) {
ctx.drawImage(img, 0, 0, width, height);
dataurl = canvas.toDataURL("image/jpeg",0.6);
// Post the data
fd.append("ori", orientation);
fd.append("image", dataurl);
$.ajax({
url: 'savetofile.php',
data: fd,
cache: false,
contentType: false,
processData: false,
enctype: 'multipart/form-data',
type: 'POST',
success: function(data){
uploadComplete2(cuantos,actual)
}
});
});
} // img.onload
}
// Load files into file reader
reader.readAsDataURL(file);
}
