@H_403_1@我有一些图像从非现场加载,无法控制它们的可用性.我发现,在很大的负载下,它们有时无法加载,但是在快速刷新时,它们会显示出来.
有没有办法检测图像是否无法加载,如果是这样,请在img src上重新加载,直到加载?如果是的话,请提供一个例子?
解决方法
这里编译的东西可能有帮助.我无法设法做这个测试,请让我知道如果你有任何问题.
- $(function() {
- var $images = $('img.imageClassUpdateAtInterval:not([src="/assets/spinner.gif"])');
- // Now,no such image with
- // a spinner
- if($images.length === 0 && window.imageLocator)
- clearInterval(window.imageLocator);
- window.imageLocator = setInterval(function() {
- $images.each(function() {
- $this = $(this);
- if (!$this.data('src')) {
- $this.data('src',$this.prop('src'));
- }
- $this.prop('src',$this.data('src') + '?timestamp=' + new Date().getTime());
- console.log($this.prop('src'));
- });
- },60 * 1000);
- // suppose,an error occured during
- // locating the src (source) of the
- // image - image not found,network
- // unable to locate the resource etc.
- // it will fall in each time on error
- // occurred
- $('img.imageClassUpdateAtInterval').error(
- function () {
- // set a broken image
- $(this).unbind("error").attr("src","/assets/broken.gif");
- // setting this up in relative
- // position
- $(this).css("position","relative");
- $(this).apppend("<span>Error occured</span>");
- $(this).find("span").css({"position": "absolute","background-color": "#252525","padding": ".3em","bottom": "0"});
- });
- });
上述解决方案是由@user113716和@travis开始的两种不同的解决方案编制而成