CODEWITHSUNDEEP
jquerywordpress
Steven
Steven

Reputation: 19435

Why am I getting ' $ is undefined'?

I've working on a Wordpress site and starting on some simple sqripts:

(function () {
    // Flex
    if ($(".flexslider").length) {
        $('.flexslider').flexslider();
    }
})(jQuery);

I've also tried

$(function () {
    // Flex
    if ($(".flexslider").length) {
        $('.flexslider').flexslider();
    }
});

jQuery is running, so why isn't $ recognized? If I replace $ with jQuery it works fine.

This also isn't working:

jQuery(document).ready(function() {

    $('.section_header').click(function(){
        alert('test');
    });
});

Upvotes: 0

Views: 162

Answers (5)

Dan
Dan

Reputation: 2341

To add to what Connor said in his answer, which basically is that you need to pass the $ as parameter to the function, in order to use the $ as jQuery.

The reason it isn't so by default, is because jQuery offers an option to disable $. This is mostly used when you are using a different JS framework which uses its own implementation of the $ variable, so no conflict would arise.

To disable jQuery from using $. You need to write the following, preferably directly after importing the jQuery library. Which should also be imported before importing any other framework.

jQuery.noConflict();

Upvotes: 0

iConnor
iConnor

Reputation: 20199

   (function ($) {
        // Flex
        if ($(".flexslider").length) {
            $('.flexslider').flexslider();
        }
    })(jQuery);

Try this

The top param is the one to be used as a reference to the bottom one

so for example you could do this 

(function (somethingHereCool) {
    // Flex
    if (somethingHereCool(".flexslider").length) {
        somethingHereCool('.flexslider').flexslider();
    }
})(jQuery);

The reason this happens (mostly in wordpress) is because wordpress uses jQuery's $.noConflict() By Defualt

so this basically means that $ doesn't belong to jQuery anymore so you can do it like above and redefine the $ in that scope for you to use. Your basically copying jQuery and giving it to $

Upvotes: 5

umbriel
umbriel

Reputation: 751

The following works for me in Wordpress

jQuery(function($) {
//code in here
});

Upvotes: 0

Leon
Leon

Reputation: 919

There's also a nonConflict option for jQuery (see: http://learn.jquery.com/using-jquery-core/avoid-conflicts-other-libraries/ ). If nonConflict is defined the $ won't be recognized.

EDIT: Besides that, if "jQuery(document).ready(function() {" isn't working either I don't think jQuery is actually linked correctly (or before you do anything).

Upvotes: 0

ghoulfolk
ghoulfolk

Reputation: 336

the $ has a different meaning/function in jQuery. I have noticed the same while making jQueries in my .jsp files. I am not sure what the $ is designed to be, but I use jQuery in the dollars place

Upvotes: 0

Related Questions