image.Onload не завершает образ - PullRequest
Новая
       19

image.Onload не завершает образ

2 голосов
/ 20 июля 2010

Это сводит меня с ума.

Мне нужно загрузить массив изображений в Javascript, но я хочу убедиться, что все изображения загружены перед началом их рисования. Итак, я занят - жду, когда будет вызвано каждое событие onLoad для изображения. Сначала я создаю изображения и устанавливаю их источник и функцию загрузки: 

// Load images from names
for (i = 0; i < this.nImages; i++) {
    this.imagesArray[i] = new Image();
    this.imagesArray[i].onload = this.onLoad(i);
    this.imagesArray[i].src = images[i];
}

Это функция onLoad, член класса, который я разрабатываю (первые два шага были в конструкторе): 

MyClass.prototype.onLoad = function (nimage) {
    console.log ("Image completed? ", nimage, " ", this.imagesArray[nimage].complete);
    this.imagesLoaded++;

}

Затем я занят, ожидая, пока все функции onLoad увеличат счетчик (снова в конструкторе): 

while (this.imagesLoaded < this.nImages) {
    // This is busy wait, and I don't like it.
    continue;
}

Пока все хорошо. Но когда я пытаюсь нарисовать его на холсте HTMl5 с помощью drawClass: 

MyClass.prototype.refresh = function () {

    // Gets one of the images in the range    
    var imageNum = this.GetImageNum();

    // Test for completeness. This gives FALSE :(
    console.log ("completeness for image number ", imageNum, " is: ", this.imagesArray[imageNum].complete);

    this.drawClass.draw(this.imagesArray[imageNum], this.xOrigin, this.yOrigin);
}

строка console.log дает false , и я получаю печально известное исключение NS_ERROR_NOT_AVAILABLE.

Обратите внимание, что функция refresh () вызывается после функции onLoad (), согласно Firebug.

Что мне здесь не хватает?

1 Ответ

7 голосов
/ 20 июля 2010

Вам необходимо присвоить onload перед установкой источника, в противном случае загрузка может быть завершена до того, как скрипт установит обработчик. Может быть, это уже исправляет.

В ожидании, это действительно никогда не бывает хорошо. Трудно предложить альтернативы, так как вы не показываете, почему вы должны ждать в первую очередь. Но хорошей идеей может быть расширение обработчика onload, чтобы определить, завершен ли массив изображений, и, если это так, запустить следующее действие - это сделает ненужное ожидание занятым.

...