[html] 이미지를 찾을 수없는 경우 HTML

Program / 글쓴이

HTML 페이지에 이미지가 있습니다.

<img src="smiley.gif" alt="Smiley face" width="32" height="32" />

서버에서 이미지를 찾을 수없는 경우보기 흉한 빈 사각형이 표시됩니다.

이미지가 발견되지 않으면 서버에 확실히있는 다른 기본 이미지 나 아무것도 표시하지 않도록 만들고 싶습니다.

어떻게 할 수 있습니까?

답변

문제를 해결하는 가장 좋은 방법 :

<img id="currentPhoto" src="SomeImage.jpg" onerror="this.onerror=null; this.src='Default.jpg'" alt="" width="100" height="120">

onerror 당신에게 좋은 것입니다 🙂

이미지 파일 이름을 변경하고 직접 시도하십시오.

답변

그럼 당신은 이것을 시도 할 수 있습니다.

  <object data="URL_TO_Default_img.png" type="image/png">
   <img src="your_original_image.png" />
  </object>

이것은 나를 위해 일했습니다. 당신에 대해 알려주세요.

답변

좋아,하지만 나는 이런 식으로 사용하는 것을 좋아한다. 그래서 원본 이미지를 사용할 수 없을 때마다 당신이 가장 좋아하는 스마일 리나 미안하다고 말하는 이미지가 될 수있는 기본 이미지를로드 할 수있다. 사용할 수 없지만 두 이미지가 모두 누락 된 경우 텍스트를 사용하여 표시 할 수 있습니다. 당신도 웃을 수 있습니다. 거의 모든 경우를 커버합니다.

<img src="path_to_original_img/img.png"  alt="Sorry! Image not available at this time"
       onError="this.onerror=null;this.src='<?=base_url()?>assets1/img/default.jpg';">

답변

여기에 이미지 이름을 잘못 입력 한 코드 스 니펫을 확인하십시오. 따라서 대체 이미지를 찾을 수없는 이미지 (404.svg)로 표시합니다. 

<img id="currentPhoto" src="https://www.ccrharrow.org/Images/content/953/741209.pg" onerror="this.src='https://www.unesale.com/ProductImages/Large/notfound.png'" alt="">

스 니펫 확장

답변

이 시나리오를 처리하는 일반적인 방법은 alt태그를 의미있는 것으로 설정하는 것입니다.

대신 기본 이미지를 원하는 경우 다음과 유사한 형식을 사용하여 호출하는 서버 측 기술을 사용하여 이미지를 제공하는 것이 좋습니다.

<img src="ImageHandler.aspx?Img=Blue.jpg" alt="I am a picture" />

에서 ImageHandler.aspx코드, 어떤 파일 찾을 수 없다는 오류를 포착하고 최대 역할을 default.jpg대신.

답변

다음을 추가하여 대체 텍스트를 표시 할 수 있습니다 alt.

<img src="my_img.png" alt="alternative text" border="0" />

답변

이미지 주위에 부모 div를 추가하고 다음 onerror 이벤트 핸들러를 사용하여 원본 이미지를 숨겼습니다. IE에서는 alt 속성을 사용한 후에도 여전히 못생긴 이미지를 찾을 수없는 이미지가 표시 되었기 때문입니다.

<div style=" width:300px; height:150px; float:left; margin-left:5px; margin-top:50px;">
        <img src='@Url.Content("~/Images/Logo-Left.png")' onerror="this.parentElement.innerHTML = '';" />
</div>