이미지에 대한 오류에 대한 이벤트 처리기를 이미지에 첨부 할 수 없습니다.

-3

요소에 대한 onerror 이벤트 핸들러를 연결하려고합니다.로드하는 동안 오류가 발생하면 텍스트로 바꿉니다.이미지에 대한 오류에 대한 이벤트 처리기를 이미지에 첨부 할 수 없습니다.

Chrome 및 Firefox에서 제대로 작동하지만 IE에서는 작동하지 않습니다. IE11을 사용하고 있습니다.

<img class="image-class" src="someURL" />

그리고 자바 스크립트 : I 때주의

<img class="image-class" onerror="imageError(this)" src="someURL" />

: 내가 가진 HTML 자체 이벤트를 바인딩을 시도

<script type="text/javascript"> 
    $(document).ready(function() { 
     var imageError = function (img) { 
      $(img).after('<span>Replacement Text</span>'); 
      $(img).remove(); 
     }; 
     var handler = function (e) { 
      imageError(e.currentTarget); 
     }; 
     $('.image-class').each(function() { 
      $(this).error(handler); 
     }); 
    }); 
</script>

이

내 이미지 요소입니다 $(this).error(handler) 행을 실행 한 후 Chrome에서 디버깅하는 경우 img 요소가 여전히 onerror이고 null으로 정의되었습니다.

IE에서 작동하지 않는 이유와 IE에서 작동하는 방법을 알고있는 사람이 있습니까?

출처

2014-07-14 jennafin

여기에 다음을 시도해보십시오. IE 9에서 정상적으로 작동합니다. 문제는 jQuery의 기대 또는 인라인 JS를 사용하여 이미지에 함수를 적용하는 방법과 관련이 있다고 의심됩니다. 2의 조합).

<!DOCTYPE html> 
<html> 
<head> 
<script> 
function byId(e){return document.getElementById(e);} 
function newEl(tag){return document.createElement(tag);} 

window.addEventListener('load', onDocLoaded, false); 

function onImgError(evt) 
{ 
    console.log("onImgError fired"); 
    console.log("Img id: " + this.id); 

    var parent = this.parentNode; 
    var span = newEl('span'); 
    span.innerHTML = "broken image replacement text"; 
    parent.insertBefore(span, this); 
    parent.removeChild(this); 
} 

function onDocLoaded() 
{ 
    var mImg = byId('mImg'); 
    mImg.addEventListener('error', onImgError, false); 
    mImg.src = "imgs/girl.png"; 
} 
</script> 
<style> 
</style> 
</head> 
<body> 
    <img id='mImg' title='image error test'/> 
</body> 
</html>

출처

2014-07-14 00:42:19 enhzflep

이미지에 대한 오류에 대한 이벤트 처리기를 이미지에 첨부 할 수 없습니다.

답변

관련 문제