jQuery: Check if image exists

Question

I'm loading an image path via jQuery $.ajax and before showing the image I'd like to check if it in fact exists. Can I use the image load/ready event or something similar to determine that the file path is valid?

Having .myimage set to display: none, I'm hoping to do something like

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

Is anything like that possible?

Answer 1

Well, you can bind .error() handler...

Update: In jQuery 3.0 and later:

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

note: .error() was deprecated in jQuery 1.8 and removed in 3.0 but in in older versions you can:

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

well, yours is okay already with load-event

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

the problem with this is if Javascript was disabled the image will not ever show...