Uncaught Error: Syntax error, unrecognized expression Jquery selector single vs double quotes

Question

When testing a site I am building I keep this error when I scroll on the page: Uncaught Error: Syntax error, unrecognized expression

I have a single page site with a high lighting nav. I know the error is caused by theID and quote syntax. I also know since jquery 1.5, quoting attribute values is mandatory and you can quote with single or double quotes. But with that in mind I am unable to eliminate the error by trying different variations of the single and double quotes. Why does this error keep appearing when the page is scrolled?

The error from Jquery is a sizzle error.

      for (var i=0; i < aArray.length; i++) {
          var theID = aArray[i];
          var divPos = $(theID).offset().top - 200; // get the offset of the div from the top of page
          var divHeight = $(theID).height(); // get the height of the div in question
          if (windowPos >= divPos && windowPos < (divPos + divHeight)) {
              $("a[href='"+ theID +"']").addClass("nav-active");
          } else {
              $("a[href='"+ theID +"']").removeClass("nav-active");
          }
      }

     // $('html, body').animate({scrollTop: $('faq').offset().top -600 });


      if(windowPos + windowHeight == docHeight) {
          if (!$("div li:last-child a").hasClass("nav-active")) {
              var navActiveCurrent = $("nav-active").attr("href");
              $("a[href='"+ navActiveCurrent+ "']").removeClass("nav-active");
              $("div li:last-child a").addClass("nav-active");
          }
      }
  });

Do you have a nav-active tag in the HTML? Here: ... = $("nav-active").attr("href");, a missing dot? — Teemu
– Teemu, Commented Feb 3, 2015 at 17:05
@Teemu I do have a nav-active tag in the html, thanks for catching the missing dot. I have added that locally, but still the error persists. — j_lemon
– j_lemon, Commented Feb 3, 2015 at 17:35
I doubt that being a valid tag name, it's rather a class name. How about the out-commented part, there's another (faq)? I couldn't persuade anything in the code to trigger that error. Can you create a jsfiddle.net which reproduces the problem? — Teemu
– Teemu, Commented Feb 3, 2015 at 17:40
@Teemu sorry, you are right. .nav-active is the class name. In this line: var divPos = $(theID).offset().top - 200; when I took out the .top-200; the error stopped. I guess that means that theID is undefined? Not sure exactly why that solved the error, but it did. — j_lemon
– j_lemon, Commented Feb 6, 2015 at 16:43

Community · Accepted Answer · 2017-05-23 11:51:05Z

I was able to resolve this error by taking out the var divHeight = $(theID).height(); and adding a little if statement about the divPosid length.

Also I had my regular header in made sure only my sticky header had <li></li> tags. The error was a result of having my regular header in the list item tag. Also this answer helped me figure this out: jQuery Syntax error, unrecognized expression

$(window).scroll(function(){
      var windowPos = $(window).scrollTop(); // get the offset of the window from the top of page
      var windowHeight = $(window).height(); // get the height of the window
      var docHeight = $(document).height();

      for (var i=0; i < aArray.length; i++) {
          var theID = aArray[i];
          var divPosid = $(theID);
              if (!divPosid.length) {
                  return;
              }
              var divPos = divPosid.offset().top - 200; // get the offset of the div from the top of page

          var divHeight = $(theID).height(); // get the height of the div in question
          if (windowPos >= divPos && windowPos < (divPos + divHeight)) {
              $("a[href='"+ theID +"']").addClass("nav-active");
          } else {
              $("a[href='"+ theID +"']").removeClass("nav-active");
          }
      }


      if(windowPos + windowHeight == docHeight) {
          if (!$("div li:last-child a").hasClass("nav-active")) {
              var navActiveCurrent = $(".nav-active").attr("href");
              $("a[href='"+ navActiveCurrent+ "']").removeClass("nav-active");
              $("div li:last-child a").addClass("nav-active");
          }
      }
  });

Collectives™ on Stack Overflow

Uncaught Error: Syntax error, unrecognized expression Jquery selector single vs double quotes

1 Answer 1

Comments

Your Answer

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Your Answer

Sign up or log in

Post as a guest

Linked

Related