привязка события onload к объекту изображения jquery - PullRequest
Новая
       23

привязка события onload к объекту изображения jquery

3 голосов
/ 16 июня 2011

Привет, у меня на сайте следующий код 

 backgroundImages[bg_img_path_b]=new Image();
 backgroundImages[bg_img_path_b].src =     bg_img_path_b;
 backgroundImages[bg_img_path_b].loaded="loading";
 //jQuery(backgroundImages[lastImage]).unbind('load.backgroundImages');                                         

 jQuery(backgroundImages[bg_img_path_b]).bind('load.backgroundImages',function(){
      if(typeof callback=='function'){
           callback.call(this, bg_img_path_b);
           if(showLoading) hideLoadingDC();
      }
 }).bind('load.cache', function(){
                            backgroundImages[bg_img_path_b].loaded="true";
                        });;

Существует большая галерея изображений, используемых в качестве фоновых изображений для обёртки страницы. Мне нужно предварительно загружать изображения из-за скорости (изображения довольно большие). Итак, у меня есть этот код (на самом деле это только часть большей функции, которая оборачивает кеширование и т. Д., Но эти несколько строк запускаются, когда изображение не в кеше) ..

backgroundImages - большой массив объектов Image, ключ - это путь к изображению. Каждое изображение объекта имеет мое свойство «загружено», который говорит, если изображение уже было загружено, или в настоящее время находится в состоянии загрузки.

Как видно из моего кода, я вызываю функцию обратного вызова, когда изображение загружается (происходят изменения фона и т. Д.)

Но у меня проблема с IE <9 .. обратный вызов не запускается успешно (но не каждый раз). Когда я загружаю свою страницу сначала, она загружается правильно, но каждый раз, когда я снова вызываю эту функцию, она идет правильно без ошибок, но событие загрузки не сработало .. </p>

Я действительно не знаю, где может быть ошибка, во всех браузерах, кроме старых IE, она работает нормально ..

На самом деле мне нужно отладить, если событие правильно связано, но я не вижу его ни в IE, ни в Chrome при загрузке элемента в отладчике: (

Пожалуйста, помогите, я полностью облажался, действительно не знаю, что делать ..

Ответы [ 2 ]

4 голосов
/ 05 июля 2011

Итак, несколько дней назад я наконец нашел решение своей проблемы. Кажется, имеет значение, если я сначала связываю событие onload, а затем устанавливаю URL-адрес Image, или сначала устанавливаю URL-адрес, а затем связываю событие. , Пример 

var photo = new Image();
photo.url = "http://www.something.com/something.jpg";
$(photo).bind('load',doSomething());


var photo = new Image();
$(photo).bind('load',doSomething());
photo.url = "http://www.something.com/something.jpg";

Первый вариант обычно работает нормально, но иногда он не работает (в старых IE) .. Но второй вариант работает нормально ..

0 голосов
/ 16 июня 2011

какую версию jQuery API вы используете?Попробуйте использовать последнюю версию jQuery.

В противном случае используйте этот простой код JavaScript для загрузки изображений при вызове вашей функции при загрузке тела: 

var myimages = new Array();
var path = "images/gallery/";

function preloadimages() {
    for (i = 0; i < preloadimages.arguments.length; i++) {
        myimages[i]=new Image();
        myimages[i].src=path+preloadimages.arguments[i];
    }
}

// Enter name of images to be preloaded inside parenthesis with douable quotes. 
// Extend list as desired with comma.
preloadimages("gImg1.jpg","gImg2.jpg","gImg3.jpg","gImg4.jpg" /*, etc...*/);
...