Последующие действия: предварительная загрузка изображений приводит к появлению неопределенной ошибки - PullRequest
0 голосов
/ 02 января 2012

Я задавал этот вопрос несколько недель назад о том, как предварительно загружать изображения в галерею. Хотя решение работает, проблема, которая возникает сейчас, заключается в том, что, если я нажимаю кнопку «Далее» для предварительной загрузки следующих трех изображений и впереди только два изображения, он запускает цикл все три раза, и Firebug выдает неопределенную ошибку.

Это код:

 $('#next').bind('click',function(){
                    var $this           = $(this);
                    var $nextimage      = $('#content img:nth-child('+parseInt(current+2)+')');
                    var next = $nextimage.next();
                    for (var i = 0; i < 3; i++)
                    {
                        var img = new Image();
                        img.src = next.attr("alt");
                        next = next.next();
                    }
                    navigate($nextimage,'right');

                });

Как мне отловить ошибку undefined, что, если есть только 2 или 1 изображения, он должен предварительно загрузить только эти изображения и не запускать цикл в третий или второй раз, чтобы выдать ошибку?

1 Ответ

2 голосов
/ 02 января 2012
$('#next').bind('click',function(){
                    var $this           = $(this);
                    var $nextimage      = $('#content img:nth-child('+parseInt(current+2)+')');
                    var next = $nextimage.next();
                    for (var i = 0; i < 3; i++)
                    {
                        if ( !next.length ) break; // This line stops your loop if there isn't any next
                        var img = new Image();
                        img.src = next.attr("alt");
                        next = next.next();
                    }
                    navigate($nextimage,'right');

                });

EDIT:

Возможно, у вас есть следующий элемент в DOM, но нет атрибута "alt":

$('#next').bind('click',function() {

    var $this = $(this),
        $nextimage = $('#content img:nth-child('+parseInt(current+2)+')'),
        $next = $nextimage.next();

    for (var i = 0; i < 3; i++) {
        if ( !$next.length ) break; // This line stops your loop if there isn't any next
        var img = new Image();
        img.src = next.attr("alt");
        $next = $next.next("[alt]"); // Only takes elements with the alt attribute.
    }

    navigate( $nextimage, 'right' );
});
...