jQuery : 이미지가 있는지 확인하십시오.

Question

jQuery $ .ajax를 통해 이미지 경로를로드하고 이미지를 표시하기 전에 실제로 존재하는지 확인하고 싶습니다. 이미지로드/준비 이벤트 또는 유사하게 파일 경로가 유효한지 결정할 수 있습니까?

이 .myimage 디스플레이로 설정 갖는 가능성 같은 것을 아무도, 내가

$(".myimage").attr("src", imagePath); 
$(".myimage").load(function() { 
    $(this).show(); 
}); 

같은 뭔가를 바라고 있어요인가?

Answer 1

글쎄, 당신은 .error() 핸들러 ... 이런

잘

$(".myimage").error(function(){ 
    $(this).hide(); 
}); 

바인딩 할 수 있습니다, 당신이이 경우입니다 문제는 load-event

$(".myimage").load(function() { 
    $(this).show(); 
}); 

에 이미 괜찮 자바 스크립트 사용 중지 된 이미지는 표시되지 않습니다 ...

Answer 2

AJAX 요청을 이미 수행 중이므로 AJAX를 지원하는 서버 측 앱으로이 요청을 오프로드합니다. 서버에서 파일이 있는지 확인하는 것은 간단하며 결과를 지정하기 위해 다시 보내는 데이터의 변수를 설정할 수 있습니다.

Answer 3

올 내가 아는 쓰레드이지만 개선 될 수 있다고 생각합니다. 나는 이미지로드와 오류 검사가 동시에 일어날 수있는 간헐적 인 문제가있는 OP를 발견했습니다. 먼저 이미지로드를 수 있도록 더 나은 다음 오류를 확인합니다 :

이

$(".myimage").attr("src", imagePath).error(function() { 
    // do something 
}); 

Answer 4

시도 :

function urlExists(testUrl) { 
var http = jQuery.ajax({ 
    type:"HEAD", 
    url: testUrl, 
    async: false 
    }) 
    return http.status; 
     // this will return 200 on success, and 0 or negative value on error 
} 

다음이 질문은 몇 살입니다

if(urlExists('urlToImgOrAnything') == 200) { 
    // success 
} 
else { 
    // error 
} 

Answer 5

사용하지만, 여기를 보는 사람을 위해 오류 처리기에 대한 더 나은 예제 사용법이 있습니다.

$("img") 
    .error(function(){ 
    $(this).hide(); 
    }) 
    .attr("src", "image.png"); 

이벤트를 잡으려고 이미지를로드하기 전에 오류 처리기를 연결해야합니다.

출처 : http://api.jquery.com/error/

Answer 6

이것은 내가 내 무슨 짓을 :

$.get('url/image', function(res){ 
    //Sometimes has a redirect to not found url 
    //Or just detect first the content result and get the a keyword for 'indexof' 
    if (res.indexOf('DOCTYPE') !== -1) { 
     //not exists 
    } else { 
     //exists 
    } 
});