Pokaż symbol zastępczy, jeśli nie znaleziono obrazu [duplikat]

Question

Próbowałem użyć onerror. Jeśli obraz nie zostanie znaleziony w folderze, wyświetla symbol zastępczy. Moja ścieżka obrazu jest dynamiczna i pochodzi z zaplecza. Poniżej przedstawiam, jak z niego korzystałem.

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

Ale to nie działa i daje błąd.

Answer 1

W tym celu użyłem picturetagu, przeglądarki spróbują najpierw źródła, a następnie, jeśli przeglądarka nie ma interpretera obrazu, użyje imgtagu.

Lubię to:

<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>