4

外部サーバーからロードされた画像を使用してjcarouselスライダーを構築しようとしています。画像はGIFとして保存され、ID：0001.gif、0002.gif、0010.gif、0011.gif...などの名前が付けられます。最初の99枚の画像を表示したいのですが、一部の画像が存在しないことがわかりました。Firefoxでは、ロードされていない画像の「プレースホルダー」がないため、これは問題ではありません。ただし、他のすべてのブラウザの場合、解決策は、ロードされていない画像を非表示にするか削除することです。これはChromeとSafariでは正常に機能しているようですが、Firefoxではキャッシュの問題があります。私の質問は; これを回避するにはどうすればよいですか？

$(document).ready(function(){
    for(var i = 0; i < 99; i++){
        // Append images 1-9 to #items
        if(i < 10){
            $('#items').append('<li class="item" id="' + i + '"><a href="http://www.fagpressen.no/id/3653?magazine=000' + i + '"><img id="' + i + '" src="http://katalogen2012.fagpressen.no/blader/forside/forside000' + i + '.gif"></a></li>');
        }
        // Append images 10 - 99 to #items
        if(i >=10 && i <= 99){
            $('#items').append('<li class="item" id="' + i + '"><a href="http://www.fagpressen.no/id/3653?magazine=00' + i + '"><img id="' + i + '" src="http://katalogen2012.fagpressen.no/blader/forside/forside00' + i + '.gif"></a></li>');
        }
    }   

    // Remove empty images
    var len = $('.item').find('img').length;
    $('.item').find('img').each(function(i){
        var img = $( this ),
            itemId = $(this).attr("id");

        img.error( function () {
            var elem = $(this);

            elem.parents('li').remove();
            if (i + 1 === len) {
                startCarousel();
            }
        }).load( function () {
            if (i + 1 === len) {
                startCarousel();
            }
        });

        if ( img.width() > 0 ) {
            img.trigger( 'load' );
        }
    });
});
4

1 に答える 1

0

.loadの代わりに.ajaxを使用してみることができます。これにより、次のようにキャッシュを無効にすることができます。

$.ajaxSetup ({
  cache: false
});
于 2012-09-06T08:36:03.427 に答える