How to hide “Image not found” icon when source image is not found?
Example: In this example, we will not hide the icon of image not found.
- When image is available:
- When the image is not found:
Methods to hide the image error icon:
- Using onerror() event: The onerror event is automatically called when the corresponding item raises an error. When the image is not found, the onerror event while call the hideImg() function which will set the visibility of the image to hidden.
- Using short-hand notation: You can apply this short-hand notation for HTML events. This will set the visibility of the reference object to hidden.
- Using jQuery: Using the JQuery error handler function error(), we can catch the error and hide the object using hide() function.
Note: The error() function has been removed from jquery version 3.0. and later.
Output: All the above codes give the same output.