0

jQueryが取得した画像をキャッシュし、同じ画像を何度も何度も表示するのを止める方法を誰でも判断できますか?

基本的に画像はウェブカメラとして機能するため、5秒ごとに再アップロードされています(画像の右下にあるタイムスタンプを確認すると、更新されているかどうかがわかります)

http://colourednoise.co.uk/scripts/index.htm

ありがとうございました

(すみません、コードの貼り付けを押し忘れました)

$(function(){
$(document).ready(function() {
    var imgs = ['http://www.ramseycommunityradio.co.uk/images/webcam.jpg', 'http://www.ramseycommunityradio.co.uk/images/webcam.jpg']
    $("#webcam").attr('src', imgs[1]);
    var refreshId = setInterval(function() {
        $("#webcam").fadeOut("slow", function() {
            var $el = $(this);
            $el.attr('src', $.inArray($el.attr('src'), imgs) === 0 ? imgs[1] : imgs[0]);
            $el.fadeIn("slow");
        });
    }, 2000);
});
4

3 に答える 3

5

変更するクエリ文字列を URL に追加してみてください。これが実際に問題である場合は、キャッシュが停止するはずです。ここでタイムスタンプを使用してこれが行われるのを見てきました:jqueryを使用してランダムな文字列を生成および追加する方法

したがって、画像を生成するたびに、次のことを行います。

var qs = (new Date).getTime();
var url = 'http://www.example.com/images/myimage.jpg?' + qs;
$(el).attr('src',url);
于 2012-12-14T12:59:16.793 に答える
2

あなたのコード:

var imgs = ['http://www.ramseycommunityradio.co.uk/images/webcam.jpg', 'http://www.ramseycommunityradio.co.uk/images/webcam.jpg']
    $("#webcam").attr('src', imgs[1]);
    var refreshId = setInterval(function() {
        $("#webcam").fadeOut("slow", function() {
            var $el = $(this);
            $el.attr('src', $.inArray($el.attr('src'), imgs) === 0 ? imgs[1] : imgs[0]); 
// this condition is redundant, it will ultimately give the same result always
// because imgs[0]==imgs[1]

            $el.fadeIn("slow");
        });
    }, 2000);

JQueryに関する限り、SRC属性を変更していません(JQueryは画像の内容について何も知りません)。サーバー側で と のように 2 つの異なる名前を交互に使用してみてください。webcam0.jpgwebcam1.jpg

于 2012-12-14T13:01:04.410 に答える
1

1 つのトリックは、画像をサーバーからリロードさせるランダムなクエリ文字列 URL を追加しないことです。コードは次のようになります。

setInterval(function() {
    var img = $("#img").get(0);
    img.src = img.src.replace(/\?.*/, "") + "?" + Math.random();
}, 5000);
于 2012-12-14T13:03:13.197 に答える