Afficher l'espace réservé si l'image est introuvable [dupliquer]

Aug 16 2020

J'essayais d'utiliser onerror. Chaque fois que l'image n'est pas trouvée dans le dossier, elle affiche un espace réservé. Mon chemin d'image est dynamique et provient du backend. Voici comment je l'ai utilisé.

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

Mais cela ne fonctionne pas et donne une erreur.

Réponses

CarlosEduardoSalazarMori Aug 16 2020 at 10:00

Pour cela, j'utilisais la picturebalise, les navigateurs essaieront la première source, puis la deuxième, si le navigateur n'a pas d'interpréteur d'image, utilisera la imgbalise.

Comme ça:

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