javascript - 如何检测 url 中的 404 错误，然后将 url 图像设置为显示 :none using Jquery

Question

我有一个表，它为每行数据重复一个指向文件下载的图像链接。我想使用 Jquery 或 Javascript 来检测图像链接是否返回 404 错误，这意味着它尝试查找的文件不存在，然后将图像链接设置为 display:none 以便将其隐藏。

非常感谢任何帮助!

杰米。

---编辑---

这是我的网址，如果找不到 .igs 文件，需要将其设置为隐藏

<a href="/path/to/file.igs"><img src="pic.jpg" alt="My Image Link"></a>

不幸的是，我无法利用服务器端处理。

Answer 1

您可以使用error()事件处理程序:

$("img").error(function () {
    $(this).css("display", "none");
});

---

我发现我们中的一些人误解了您的起源问题，您的编辑澄清了一些。您只需使用 AJAX 即可实现您想要的效果。只需请求文件的 header 就足够了:

// Find all <a> tags where href ends with .igs, hide and loop over them 
$("a[href$=.igs]").hide().each(function (i, el) {
    $.ajax({
        type: "HEAD",
        url: el.href,
        success: function () {
            // Success, we can unhide the element.
            el.show();
        }
    });        
});

当然，如果文件位于其他域上，则此方法将不起作用。此外，如果客户端和服务器数量很多，这对于客户端和服务器来说都是一个相当昂贵的过程。