이미지를 찾을 수없는 경우 자리 표시 자 표시 [중복]

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>