源变化后的jquery刷新图像

我有一个JavaScript函数，我在其中播放声音文件（使用phonegap）。它通常工作正常，但我想在下载文件时将img src更改为加载图标。但是，播放文件后，src被更改为。源变化后的jquery刷新图像

我试图将+new Date().getTime()添加到src的末尾，但它没有帮助。有什么想法吗？

function playSound(){ 


var img = $(this).prev(); 

img.attr("src", "css/images/ajax-loader.gif?"+new Date().getTime()); 


var url = "http://some.com/fanky.mp3"; 
mediaTTS = new Media(url, onSuccessTTS(url), onErrorTTS); 
mediaTTS.play(); 

}

来源

2012-09-04 noway

再次添加的延迟可能是一个预载的问题。 [通过javascript预载图片的Google搜索]（https://www.google.se/search?q=preload+images+javascript&aq=f&sugexp=chrome,mod=5&sourceid=chrome&ie=UTF-8）。首先尝试，如果它仍然存在，我们继续前进。 :) –

这可能是由于这样的事实，直到当前运行循环结束时才重新绘制图像。如果Media.play()被阻挡，则在完成播放之前可能看不到图像更改。

为了证实我的怀疑，请尝试以下代码：

function playSound(){ 
    var img = $(this).prev(); 
    img.attr("src", "css/images/ajax-loader.gif?"+new Date().getTime()); 
    setTimeout(function() { 
     var url = "http://some.com/fanky.mp3"; 
     mediaTTS = new Media(url, onSuccessTTS(url), onErrorTTS); 
     mediaTTS.play(); 
    }, 100); 
}

来源

2012-09-04 22:06:32

谢谢，这是问题所在。使用您的代码，它会更新代码并显示加载动画，但是它会阻止动画一段时间。但它总比没有好。 – noway

是的，它看起来像你的媒体元素阻塞主线程。你应该看看文档，看看是否有办法让它预加载异步。 –

尝试删除src属性，然后用不同的SRC

function playSound(){ 
    var img = $(this).prev(); 
    img.removeAttr("src").attr("src","css/images/ajax-loader.gif?"+new Date().getTime()); 
    var url = "http://some.com/fanky.mp3"; 
    mediaTTS = new Media(url, onSuccessTTS(url), onErrorTTS); 
    mediaTTS.play(); 
}

来源

2012-09-04 22:07:27

源变化后的jquery刷新图像

回答

相关问题