Gman256
Gman256

Reputation: 33

How to Solve "Uncaught TypeError: $ is not a function"?

I got Uncaught TypeError: $ is not a function error when i'm trying to bring the ID and store it in variable

Here i got the error => {var topMenu = $('primary-menu');}

// Cache selectors
var topMenu = $('primary-menu');
    topMenuHeight = topMenu.outerHeight()+15,
    // All list items
    menuItems = topMenu.find('a[href^="#"]'),
    // Anchors corresponding to menu items
    scrollItems = menuItems.map(function(){
      var item = $($(this).attr("href"));
      if (item.length) { return item; }
    });

// Bind to scroll
$(window).scroll(function(){
   // Get container scroll position
   var fromTop = $(this).scrollTop()+topMenuHeight;

   // Get id of current scroll item
   var cur = scrollItems.map(function(){
     if ($(this).offset().top < fromTop)
       return this;
   });
   // Get the id of the current element
   cur = cur[cur.length-1];
   var id = cur && cur.length ? cur[0].id : "";
   // Set/remove active class
   menuItems
     .parent().removeClass("act")
     .end().filter("[href='#"+id+"']").parent().addClass("act");
});​

Upvotes: 2

Views: 4270

Answers (1)

Sebastian Kaczmarek
Sebastian Kaczmarek

Reputation: 8515

WordPress has its own jQuery version which is loaded by default. In order to avoid conflicts you have two options:

  1. Use jQuery instead of $ - which means that all custom code should use jQuery and not $
  2. Wrap your custom code in the following code:
jQuery(function ($) {
    // here you can use $
    console.log($('.primary-menu'));
});

Upvotes: 4

Related Questions