jQuery .map() Issue

Question

I have basically no experience with jQuery, just enough to get by most of the time. However, I recently have been changing some templates around and came across a piece of jQuery that I didn't write, but is throwing an error (Uncaught Error: Syntax error, unrecognized expression: /). I'm not really sure where to start. All I know so far is that I'm fairly certain this piece of code is causing it, and it's choking right at the scrollItems line:

// Cache selectors
var lastId,
    topMenu = $(".nav"),
    topMenuHeight = topMenu.outerHeight() + 50,
    // All list items
    menuItems = topMenu.find("a"),
    // Anchors corresponding to menu items
    scrollItems = menuItems.map(function() {
        var item = $($(this).attr("href"));
        if (item.length) {
            return item;
        }

        ///////////////FANCYBOX 
        $(".fancybox-media").fancybox({
            arrows: true,
            padding: 0,
            closeBtn: true,
            openEffect: 'fade',
            closeEffect: 'fade',
            prevEffect: 'fade',
            nextEffect: 'fade',
            helpers: {
                media: {},
                overlay: {
                    locked: false
                },
                buttons: false,
                title: {
                    type: 'inside'
                }
            },
            beforeLoad: function() {
                var el, id = $(this.element).data('title-id');
                if (id) {
                    el = $('#' + id);
                    if (el.length) {
                        this.title = el.html();
                    }
                }
            }
        });
    });

I have tested the fancybox code separately, and it works, but I thought I'd leave it in to be thorough. There was also some commented out code that I took out. Any help would be very much appreciated!

Can you show the HTML of the .nav section? Specifically wondering what the href values are. If there are full URLs in there (esp. something with a / in it), I'd expect that error, since what would $("foo/bar.html") mean? — Paul Roub
– Paul Roub, Commented Aug 13, 2015 at 22:53

Guffa · Accepted Answer · 2015-08-13 23:01:53Z

1

It's likely that it is this line that is causing the error:

var item = $($(this).attr("href"));

You seem to have a link with href="/" (a link to the start page), so the code will do the same as:

var item = $("/");

jQuery will try to parse the URL as a selector, and you get that exact error message.

Check that the href attribute contains a bookmark and not an URL before you try to use it as a selector:

var href = $(this).attr("href");
if (href.substr(0, 1) == "#") {
  var item = $(href);
  if (item.length) {
    return item;
  }
}

answered Aug 13, 2015 at 23:01

Guffa

703k111 gold badges760 silver badges1k bronze badges

Sign up to request clarification or add additional context in comments.

1 Comment

avery_laird Over a year ago

I realized after I posted the question that this is the cause! You were spot on. Thanks!

Collectives™ on Stack Overflow

jQuery .map() Issue

1 Answer 1

1 Comment

Your Answer

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

1 Comment

Your Answer

Sign up or log in

Post as a guest

Related