посмотреть, существует ли src из img

Question

когда я размещаю тег img, я создаю атрибут src динамически.Есть ли способ проверить, если src (путь, где находится изображение) действительно существует с javascript, чтобы избежать получения:

Answer 1

Вы можете использовать событие error:

var im = document.getElementById('imageID'); // or select based on classes
im.onerror = function(){
  // image not found or change src like this as default image:

   im.src = 'new path';
};

Встроенная версия:

<img src="whatever" onError="this.src = 'new default path'" />

Или

<img src="whatever" onError="doSomething();" />

---

*Тег 1013 *<img> поддерживает следующие события:

• abort (onAbort)
• error (onError)
• load (onLoad)

Дополнительная информация:

• События JavaScript
• jQuery's error

Answer 2

вы можете сделать предыдущий вызов ajax (с помощью метода head) и увидеть код возврата сервера, или вы можете использовать событие onerror, чтобы изменить URL или сделать его скрытым, например,

<img src="notexist.jpg" onerror="this.style.visibility = 'hidden'">

(Я использовал встроенный атрибут, чтобы объяснить идею)

Answer 3

Если вы динамически создаете src с помощью javascript, вы можете использовать это:

var obj = new Image();
    obj.src = "http://www.javatpoint.com/images/javascript/javascript_logo.png";

if (obj.complete) {
    alert('worked');
} else {
    alert('doesnt work');
}

Answer 4

Вы подходите к этому неправильно.
Когда вы генерируете свои ссылки с помощью серверного скрипта, проверьте его там, существует ли файл (например, с помощью file_exists() в PHP).

Вы не должны полагаться на JavaScript, когда вы можете сделать это на стороне сервера, поскольку JavaScript может быть изменен и отключен.

Спросите себя, как вы генерируете атрибуты src=, и проверьте, существует ли файл или нет, и предоставьте альтернативу.