1

有谁知道验证图像 URL 是否存在的轻量级方法?

我有一个图像列表(有些是 404 的),我将其提供给我的 jquery 图像查看器插件(或任何其他 javascript 灯箱插件),它不能很好地处理 404 图像 URL。

我知道您可以使用onerrorhtml img 元素上可用的事件,这可能是最有效的,我之前用于需要使用<img>标签的其他图像查看器插件,但并非所有插件都使用该标签(包括我的当前一个),所以我想知道如何验证 URL 以使插件不会阻塞它们?

我想我可以创建一个<img>元素 set display:none,一次设置一个图像,并通过检查 onerror 事件来确定它是否有效,但这似乎效率低下。还有其他更简单的方法吗?你会认为这些插件的一些基本行为会检查这一点,但我还没有找到一个符合我标准的插件。

4

2 回答 2

1

发出 HEAD Ajax 请求

您的图像是否托管在同一个域上?如果是这样,您可以发出 Ajax 类型的“HEAD”请求来查看它是否是 404,而无需检索图像本身的内容。这应该使您的初始检查非常快速和有效。请参阅此线程以获取我认为与您要完成的内容有些相似的示例:

通过 Javascript/jQuery 的 Ajax HEAD 请求

做服务器端

如果您的图像不在同一个域中,或者您需要支持可能无法执行 HEAD Ajax 请求的旧浏览器,我会很想验证您的 URL 服务器端。在页面加载之前执行此操作,或者如果您不能,请对您自己的服务器端脚本进行 Ajax 调用。服务器端脚本可以获取每个 URL 的标头(同样无需拉取图像数据本身)并告诉您哪些是有效的。

于 2013-07-14T01:13:13.113 回答
0

我最终选择了@Volatile 的解决方案(来自问题下的评论)并将图像添加到隐藏img标签中,然后在该组隐藏标签上使用imagesLoaded 插件img仅过滤那些成功加载的标签。然后图像查看器插件对非 404 图像感到满意,并从浏览器缓存中检索它们。

于 2013-08-27T17:53:09.413 回答