如何在一段时间后取消图像加载? [英] How to cancel an image load after a period of time?
问题描述
我需要能够在一段时间后取消图片加载,并且需要随后调用onError动作。
它会做什么:
尝试检索资源。 src =https://www.site.com/cgi-bin/pullimg.cgi?user=+encodeURI(document.cookie),它提取用户特定资源。Cookie存储在受保护的文件夹中。
如果它不能在1秒内(1000 ms),那么执行onError。
onError更改图像src属性,然后重新加载img。(更改到不同的uri,例如mirror.site.com/err.png)
另外,它可以是一个JavaScript函数(newImage) 。
对不起,没有提供现有的代码;我可以用多个lang代码。
函数loadImage(url,altUrl){
var timer;
函数clearTimer( ){
if(timer){
clearTimeout(time。) r);
timer = null;
函数handleFail(){
//杀死以前的错误处理程序
this.onload = this.onabort = this.onerror = function (){};
//停止存在的定时器
clearTimer();
//切换到备用网址
if(this.src === url){
this.src = altUrl;
}
}
var img = new Image();
img.onerror = img.onabort = handleFail;
img.onload = function(){
clearTimer();
};
img.src = url;
timer = setTimeout(function(theImg){
return function(){
handleFail.call(theImg);
};
}(img),1000) ;
return(img);
}
//然后你可以这样称呼它
loadImage(https://www.example.com/cgi-bin/pullimg.cgi?user=+ encodeURI(document.cookie),http://mirror.site.com/err.png);
I need to be able to cancel an image load after a set period of time, and it needs to subsequently call the onError action.
What it will do:
Attempt to retrieve the resource. src="https://www.site.com/cgi-bin/pullimg.cgi?user=+encodeURI(document.cookie) , which pulls a user-specific resource. The cookies are stored in a protected folder.
If it can't in 1 second (1000 ms), then execute onError.
onError changes the images src attribute, then reloads the img. (Changes to different uri, like mirror.site.com/err.png)
Also, it can be a javascript function (newImage).
Sorry for not supplying existing code; I can code in multiple langs though.
You can use this code to load an image and, if not successfully loaded within 1 second (whether the failure is via onerror, onabort or from the time elapsing), switch to load an alternate image.
function loadImage(url, altUrl) {
var timer;
function clearTimer() {
if (timer) {
clearTimeout(timer);
timer = null;
}
}
function handleFail() {
// kill previous error handlers
this.onload = this.onabort = this.onerror = function() {};
// stop existing timer
clearTimer();
// switch to alternate url
if (this.src === url) {
this.src = altUrl;
}
}
var img = new Image();
img.onerror = img.onabort = handleFail;
img.onload = function() {
clearTimer();
};
img.src = url;
timer = setTimeout(function(theImg) {
return function() {
handleFail.call(theImg);
};
}(img), 1000);
return(img);
}
// then you call it like this
loadImage("https://www.example.com/cgi-bin/pullimg.cgi?user=" + encodeURI(document.cookie), "http://mirror.site.com/err.png");
这篇关于如何在一段时间后取消图像加载?的文章就介绍到这了,希望我们推荐的答案对大家有所帮助,也希望大家多多支持IT屋!