Search for images on a page with a specific file name using jquery

Question

I need to do a check on the page to check if certain images are loaded, i.e. does not return 404. If they are available, I want to replace the image with default images.

I know that I can assign an onerror handler for images.

Firstly, I need to use a selector to find all images that have a source that contains the following image name → /folder/Product_1234_P.jpg OR / folder / Product_9876_Q.gif

Any ideas how I can create a high performance selector that I can use to search for such images so that I can check if the images are loaded if they do not replace the image name: Product_Default_P.jpg or Product_Default_Q.gif

Any help or advice would be wonderful.

Answer 1

You can use an error handler, and the attribute contains a selector like this:

$("img[src*=Product]").error(function() {
    $(this).attr('src', 'notfound.jpeg');
});

Answer 2

$('img[src*="substring"]')

This is an attribute selector. Check out http://api.jquery.com/attribute-contains-selector/

Answer 3

I assume you mean something like

$("img[src^=/folder/Product_][src$=_P.jpg]")

i.e. "Find all img with src, starting with" / folder / Product _ "and ending with" _P.jpg ".