Question

我正在创建一个包含带有相册艺术的广播流的网页。我通过每10秒查询一个XML文件并将xml标签的内容与当前显示的图像的src进行比较来更新专辑封面。

我提出了以下脚本。我遇到的问题是，如果＆＃39; albumart＆＃39; （xml标签）为空我正在显示＆＃39; generic.png＆＃39; （请参阅最后的if / else）但每次脚本重复时都会重新加载此generic.png（淡入和淡出）。

是否有一种简单的方法可以阻止图像重新加载和不断淡入淡出？

function checkalbumart() {
jQuery.ajax({
     type: "GET",
     url: "xml-file.php",
     dataType: "xml",
     success: function(xml) {
          jQuery(xml).find('currenttrack').each(function() {
               xmlalbumart = jQuery(this).find('albumart').text();
          });
          currentalbumart = jQuery('#albumart img').attr('src');

          if (xmlalbumart != currentalbumart ) {
               if (xmlalbumart) {
                    jQuery('#albumart').fadeTo( "fast" , 0, function () {
                         jQuery('#albumart img').attr('src', xmlalbumart);
                    }).fadeTo( "fast", 1);
               } else {
                    jQuery('#albumart').fadeTo( "fast" , 0, function () {
                         jQuery('#albumart img').attr('src', './img/generic.png');
                    }).fadeTo( "fast", 1);
               }
          }
     }
}).always(function() {
     setTimeout(updateshow, 10000);
});

}

checkalbumart();

Answer 1

您需要检查currentalbumart是否设置为通用图像，请尝试以下代码：

function checkalbumart() {
jQuery.ajax({
     type: "GET",
     url: "xml-file.php",
     dataType: "xml",
     success: function(xml) {
          jQuery(xml).find('currenttrack').each(function() {
               xmlalbumart = jQuery(this).find('albumart').text();
          });
          currentalbumart = jQuery('#albumart img').attr('src');

          if (xmlalbumart != currentalbumart ) {
               if (xmlalbumart) {
                    jQuery('#albumart').fadeTo( "fast" , 0, function () {
                         jQuery('#albumart img').attr('src', xmlalbumart);
                    }).fadeTo( "fast", 1);
               } else if(currentalbumart != './img/generic.png') {
                    jQuery('#albumart').fadeTo( "fast" , 0, function () {
                         jQuery('#albumart img').attr('src', './img/generic.png');
                    }).fadeTo( "fast", 1);
               }
          }
     }
}).always(function() {
     setTimeout(updateshow, 10000);
});

}

checkalbumart();

使用AJAX交换图像src但不重复重新加载

1 个答案: