图像损坏或在Firefox中被截断 [英] image corrupt or truncated in firefox
问题描述
下面的我的代码(以及此处: http://jsbin.com/oseruc/1 )会翻阅给定的每次单击鼠标都会显示图像.除了最新的Firefox之外，它在所有可以测试的浏览器中都可以正常工作. Firefox显示以下错误:
有什么想法为什么会发生以及如何解决?因为我不能仅仅忽略这些错误.它们会干扰我的功能.
我的代码:
尝试一下:
window.onload = function () {
var frame_num = 0;
var image = document.getElementById("image");
function load_next_image() {
image.onclick = null;
frame_num = (frame_num + 1) % frames.length;
image.src = frames[frame_num];
return false;
};
image.onclick = load_next_image;
image.onload = function() {
image.onclick = load_next_image;
}
};
每当单击图像时，它都会暂时禁用点击处理程序，然后在图像加载完成后重新启用它.
my code below (as well as here: http://jsbin.com/oseruc/1) flips through the given images on each mouse click. It works fine in all browsers that I could test it on, except for the latest Firefox. Firefox displays errors such as:
Image corrupt or truncated: http://upload.wikimedia.org/wikipedia/commons/0/0c/St._Cristopher-D%C3%BCrer.jpg Image corrupt or truncated: http://upload.wikimedia.org/wikipedia/commons/0/0c/St._Cristopher-D%C3%BCrer.jpg Image corrupt or truncated: Rhinoceros.jpg">http://upload.wikimedia.org/wikipedia/commons/b/b9/D%C3%BCrer-_Rhinoceros.jpg Image corrupt or truncated: http://upload.wikimedia.org/wikipedia/commons/0/0c/St._Cristopher-D%C3%BCrer.jpg Image corrupt or truncated: Rhinoceros.jpg">http://upload.wikimedia.org/wikipedia/commons/b/b9/D%C3%BCrer-_Rhinoceros.jpg
This happens if I click too fast. And yes, have seen this bug report: http://code.google.com/p/fbug/issues/detail?id=4291
Any ideas why this is happening and how to fix that? Because I cannot just ignore these errors. They interfere with my functionality.
My code:
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8" />
<script type="text/javascript">
(function (window) {
var frames = [
"http://upload.wikimedia.org/wikipedia/commons/6/65/Duerer_%28Marter_der_zehntausend_Christen%29.jpg",
"http://upload.wikimedia.org/wikipedia/commons/0/0c/St._Cristopher-D%C3%BCrer.jpg",
"http://upload.wikimedia.org/wikipedia/commons/b/b9/D%C3%BCrer_-_Rhinoceros.jpg"
];
window.onload = function () {
var frame_num = 0;
var image = document.getElementById("image");
image.onclick = function () {
frame_num = (frame_num + 1) % frames.length;
image.src = frames[frame_num];
return false;
};
};
})(window);
</script>
</head>
<body>
<img id="image" src="http://upload.wikimedia.org/wikipedia/commons/6/65/Duerer_%28Marter_der_zehntausend_Christen%29.jpg" style="position:relative">
</body>
</html>
Try this:
window.onload = function () {
var frame_num = 0;
var image = document.getElementById("image");
function load_next_image() {
image.onclick = null;
frame_num = (frame_num + 1) % frames.length;
image.src = frames[frame_num];
return false;
};
image.onclick = load_next_image;
image.onload = function() {
image.onclick = load_next_image;
}
};
Whenever you click on an image it temporarily disables the click handler, then re-enables it when the image is finished loading.
这篇关于图像损坏或在Firefox中被截断的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
