Показать заполнитель, если изображение не найдено [дубликат]

Question

Я пытался использовать onerror. Если изображение не найдено в папке, оно отображает заполнитель. Мой путь к изображению является динамическим и исходит из серверной части. Ниже показано, как я это использовал.

<img class="" src="{{imagePath}}my_image.jpg" onerror="this.src='{{imagePath}}placeholder.jpg';" alt="Image not found">

Но это не работает и дает ошибку.

Answer 1

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

Как это:

<picture>
  <source alt="Special Days" srcset="[First Image route].jpg" type="image/jpeg">
  <source alt="Special Days" srcset="[Second Image route].jpg" type="image/jpeg">
  <img alt="Imagen" src="[First Image route].jpg">
</picture>