jQuery to perform an event when an image is broken

Question

I found this problem mentioned before here jQuery/Javascript to replace broken images

and this was the best answer.. I tried it and it's working fine

function ImgError(source){
   source.src = "/images/noimage.gif";
   source.onerror = "";
   return true;
}

<img src="someimage.png" onerror="ImgError(this);"/>

but when I tried to preform other events in the previous function

function ImgError(source){
   source.hide(); // hide instead of replacing the image
   source.onerror = "";
   return true;
}

I got this error

TypeError: 'undefined' is not a function (evaluating 'source.hide()')

Every single jQuery event/method I tried that function I got a TypeError.

What's the problem?

Answer 1

Because .hide() is a jQuery element.

Try that:

function ImgError(source) {
   $(source).hide();
   source.onerror = "";
   return true;
}

Answer 2

hide() is a jQuery method, yeah?

try $(source).hide()

:)

edit: you may try adding a global error handler for all images like so:

$('img').error(function() { $(this).hide(); });

see: http://api.jquery.com/error/

Answer 3

did you tried the following:

source.style.visibility='hidden';