Does the <img> tag have an "onsuccess" attribute?

Question

Does the <img> tag have an "onsuccess" attribute? Like "onerror".

I am loading an image. I bind an event with JQuery, which changes image onerror. i want to show an alert "ONERROR Image loaded successfuly" if onerror image successfully loaded. Otherwise it will show alert "ONERROR image not found".

EDIT: onload shows alert after loading image. but didn't tells us that "your real image is loaded" or "browser's default error image is loaded". check here...

http://jsfiddle.net/extremerose71/cHuu6/6/

Answer 1

If you wrote something like:

<img id="im3" src="http://ssl.gstatic.com/gb/images/j_f11bbae8.png" />​

And also wrote:

$(window).load(function() {
   $("#im3").load( function (){
      alert('load');
   }).error( function (){
      alert('error');
   });
});

(as in jsfiddle onLoad is corresponded to $(window).load) , you will never get any alert, because $(window).load will be called after all resources is already loaded.

But if you would remove src from img:

<img id="im3"/>​ 

And then add this

$("#im3").attr('src','http://ssl.gstatic.com/gb/images/j_f11bbae8.png' )​​​​​​​​​​​​​​;

line after the load and error listeners , you will see an alert.

So the main problem was , that you were adding listeners after the image has already loaded or failed to load.

Answer 2

I think you can use

function loadImage()
{
    alert("Image is loaded");
}
function errorImage()
{
    alert("Image not loaded");
}
<img src="someImg.png" onload="loadImage()" onerror="errorImage()" />

Reference: onload and onerror.

On successful image load onload event handler(loadImage function) will fire and if image is not loaded then onerror event handler(errorImage function) will fire.

Answer 3

Yes you can do that, read here. You can use:

• onload
• onerror
• onabort

And all these three events are supported in all major browsers.

You can find these three events also on MDN DOM event reference.