0

いつ生成されるかわからない画像を2枚表示したい。そこで、jqueryのエラー関数を使用して、画像が存在するかどうかを確認し続け、それぞれを表示したいと思います。次のコードは、IEを除くすべてのブラウザで機能します。なぜIEで動作しないのですか、本当にあなたの助けに感謝します。

<style type="text/css">
DIV#loader {
    width: 500px;
    height: 500px;
    overflow: hidden;
}

DIV#loader.loading {
    background: url(spinner.gif) no-repeat center center;
}
</style>


<script type="text/javascript">
$(document).ready(function() {
    var image_names = new Array(2);
    image_names[0] = 'a.jpg';
    image_names[1] = 'b.jpg';
    var divs = document.getElementsByTagName("div");
    for ( var i = 0; i < divs.length; i++) {
        showImage(image_names[i], divs[i]);
    }
});

function showImage(src, div) {
    var img = new Image();
    $(img).load(function() {
        $(this).hide();
        $(div).removeClass('loading').append(this);
        $(this).fadeIn();
    }).error(function() {
        setTimeout(function() {
            $(img).attr('src', src);
        }, 2000);
    }).attr('src', src);
}
</script>

これはHTML本文です

<body>
<h1>Image Loading</h1>
<div id="loader" class="loading"></div>
<div id="loader" class="loading"></div>
</body>

ページが最初に読み込まれたときに画像が存在しない場合、IEは画像が生成されたことを認識していないようです

4

2 に答える 2

0

キャッシングが問題を引き起こしました。srcを次のように変更しました：

$(img).attr('src', src + "?" + (new Date().getTime()));
于 2012-07-23T15:28:28.597 に答える
0

それはその$(document).ready({})一部です。ieでエラーをスローします。に変更すると$(function(){}); 、少なくともIEでは機能するようです。

于 2012-07-23T00:37:28.930 に答える