javascript – 图像损坏或在Firefox中截断

前端之家收集整理的这篇文章主要介绍了javascript – 图像损坏或在Firefox中截断前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
下面的代码(以及这里: http://jsbin.com/oseruc/1)在每次点击鼠标时翻转给定的图像.它可以在我可以测试的所有浏览器中正常工作,除了最新的Firefox. Firefox显示错误,例如:
Image corrupt or truncated: 07001._Cristopher-D%C3%BCrer.jpg
Image corrupt or truncated: 07001._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: 07001._Cristopher-D%C3%BCrer.jpg
Image corrupt or truncated: Rhinoceros.jpg">http://upload.wikimedia.org/wikipedia/commons/b/b9/D%C3%BCrer-_Rhinoceros.jpg

如果我点击太快就会发生这种情况.是的,已经看过这个错误报告:http://code.google.com/p/fbug/issues/detail?id=4291

任何想法为什么会发生这种情况以及如何解决这个问题?因为我不能忽视这些错误.它们干扰了我的功能.

我的代码

<!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>
@H_301_14@

解决方法

试试这个:
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;
    }
};

每当您单击图像时,它会暂时禁用单击处理程序,然后在图像加载完成后重新启用它.

@H_301_14@ @H_301_14@ 原文链接:https://www.f2er.com/js/151150.html

猜你在找的JavaScript相关文章