Skip to content
Advertisement

Checking for visible items to a caption with jQuery – need different approach

With jQuery I need to check for a caption if there are visible list-items for that caption.
Below is my approach, basically checking for li elements with the same class name which are visible, by string concatenating the class names. This is not working for the following reasons:

When I use

JavaScript

the script fails as soon as I have selectors with special characters, in this example '&'

I tried using the jQuery.escapeSelector() function:

JavaScript

But this seems to not work because we are using an older jQuery Version, which comes with Magento 2.3 and I cannot change.

I could now try to escape the characters myself, like here:
Need to escape a special character in a jQuery selector string

but all of this made me question my whole approach. Maybe jQuery provides an easier solution?

What would be the easiest and cleanest way to achieve my original goal?

Check for each caption if there are visible items.

I cannot change jQuery Version or the fact that there are class names with special chars in them.
Pretty much all of the rest could be adjusted including the html structure.

Anyway, here’s the code to my approach

JavaScript
JavaScript

Advertisement

Answer

I solved it like this now:

  1. Query for all visible li.product
  2. filter() the result for items that have the same class as the h4

Might also try to get rid of the invalid chars in the class name, but that’s another topic.

JavaScript
JavaScript
JavaScript
User contributions licensed under: CC BY-SA
6 People found this is helpful
Advertisement