JQuery.noConflict and how to use it

Question

I am trying to use jQuery.noConflict() , but in the window.load function I get the error "$ is not a function".

my code is:

 jQuery.noConflict(); jQuery(document).ready(function($) { /** Dropdown Menu **/ $('ul.tabs li:has(ul)').bind("click", function() { $(this).find('ul').show('normal'); //event.stopPropagation(); }); $('ul.tabs li').bind("mouseleave", function() { $(this).find('ul').hide('normal'); //event.stopPropagation(); }); }); jQuery(window).load(function($) { $('#container').fadeIn('normal'); }); 

if I use jQuery instead of '$', it works fine, but can I continue to use '$'? Does anyone know / understand what is wrong with this? thanks!

Answer 1

The first part of your code works because the jQuery $ object is always passed to ready handlers. However, the same behavior does not apply to load handlers.

If you do not want to replace $ with jQuery in the body of your load handler, you can commit this variable in closure:

 (function($) { $(window).load(function() { $("#container").fadeIn("normal"); }); })(jQuery); 

Alternatively, you can register the load handler inside your ready handler, where $ correctly bound.

Answer 2

If you use jQuery.noConflict() , $ no longer defined for use with jQuery.

You should use jQuery() instead of $()

As stated in the doc :

Many JavaScript libraries use $ as the name of a function or variable, just as jQuery does. In the case of jQuery, $ is just an alias for jQuery, so all functions are available without using $. If we need to use another JavaScript library along with jQuery, we can return the $ control back to another library with a call to $ .noConflict ()

---

Thansk for comment.

If you want to use the $ parameter