Измените источник изображения, если файл существует

У меня http://jsfiddle.net/rcebw/3/

В этом я буду иметь множество этих inlinediv div. Каждый из них имеет 2 div внутри, один из которых содержит изображение и тот, который содержит ссылку. Они генерируются динамически из списка дочерних сайтов на другом сайте.

Что я хочу сделать, это проверить каждый div с классом inlinediv. Получите внутренний текст ссылки в div iconLinkText и найдите файл с этим именем на сайте. (http://www.mojopin.co.uk/images/ для этого теста.) Если он существует, измените изображение src на него.

Я, вероятно, беру на это совершенно неправильный путь, но я не могу заставить его работать. При тестировании он даже не может найти inlinediv div! Говорит ему null.

Я новичок в jQuery, но есть ли у кого-нибудь какие-либо советы? (Я даже не знаю, хорошо ли я себя объяснил!)

Ответ 1

Вам не нужно использовать 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
}

Здесь рабочая реализация http://jsfiddle.net/jeeah/

Ответ 2

Политика одинакового происхождения не позволяет вам делать запросы AJAX в других доменах. Если вы не запускаете это на "http://www.mojopin.co.uk", этот код не будет работать.

Ответ 3

Вы не можете решить эту проблему только с помощью jQuery: Одинаковая политика происхождения не позволит вам делать запросы на третьи веб-сайты.

Самое простое решение - реализовать службу на вашем сервере, которая запрашивает запросы на внешний веб-сайт.

В принципе, если ваш сайт находится на

http://www.foo.bar

то вы создаете

http://www.foo.bar/scheckscript.php (например)

который вы можете запросить с нужным URL

http://www.foo.bar/scheckscript.php?url=http%3A//www.third.com