javascript 如果文件存在，则更改图像源
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/5678899/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Change image source if file exists
提问by anothershrubery
I have http://jsfiddle.net/rcebw/3/
我有http://jsfiddle.net/rcebw/3/
The point of this is I will have numerous of these inlinedivdivs. Each one has 2 divs inside it, one which holds an image and one which holds a link. These are generated dynamically from a list of the subsites on another site.
关键是我将拥有许多这样的inlinedivdiv。每个里面有 2 个 div，一个保存图像，一个保存链接。这些是从另一个站点上的子站点列表动态生成的。
What I want it to do is check each div with the class inlinediv. Get the inner text of the link in div iconLinkTextand search for a file with that name at the site. (http://www.mojopin.co.uk/images/for this test.) If it exists then change the image src to it.
我想要它做的是用 class 检查每个 div inlinediv。获取 div 中链接的内部文本iconLinkText并在站点上搜索具有该名称的文件。（http://www.mojopin.co.uk/images/用于此测试。）如果它存在，则将图像 src 更改为它。
I am probably taking the absolutely wrong route for this but I can't seem to get it to work. When testing it can't even find the inlinedivdiv! Says it's null.
我可能为此采取了绝对错误的路线，但我似乎无法让它发挥作用。测试时它甚至找不到inlinedivdiv！说是空的。
I'm pretty new to jQuery but does anyone have any advice? (I don't even know if I've explained myself well!)
我对 jQuery 很陌生，但有人有什么建议吗？（我什至不知道我是否已经很好地解释了自己！）
回答by Matt King
You don't have to use AJAX to do this, since you can hot-link images from other domains without any restrictions. Here's how you can check if an image exists:
您不必使用 AJAX 来执行此操作，因为您可以不受任何限制地从其他域中热链接图像。以下是检查图像是否存在的方法：
function checkImage(src) {
var img = new Image();
img.onload = function() {
// code to set the src on success
};
img.onerror = function() {
// doesn't exist or error loading
};
img.src = src; // fires off loading of image
}
Here's a working implementation http://jsfiddle.net/jeeah/
这是一个有效的实现http://jsfiddle.net/jeeah/
回答by Diodeus - James MacFarlane
The Same Origin Policyprevents you from making AJAX requests to other domains. Unless you're running this on "http://www.mojopin.co.uk", this code won't work.
该同源策略阻止您的AJAX请求到其他领域。除非您在“http://www.mojopin.co.uk”上运行此代码，否则此代码将不起作用。
回答by Giovanni Di Milia
You cannot solve this problem only with jQuery: The Same Origin Policywont allow you to make requests to third web sites.
仅使用 jQuery 无法解决此问题：同源策略不允许您向第三方网站发出请求。
The easiest solution is to implement a service on your server that proxies the requests to the external website.
最简单的解决方案是在您的服务器上实施一项服务，将请求代理到外部网站。
Basically if your website is on
基本上，如果您的网站在
then you create
然后你创造
http://www.foo.bar/scheckscript.php(for example)
http://www.foo.bar/scheckscript.php（例如）
that you can query with the url you need
您可以使用所需的网址进行查询
http://www.foo.bar/scheckscript.php?url=http%3A//www.third.com
http://www.foo.bar/scheckscript.php?url=http%3A//www.third.com
