Jquery No Conflict jquery-1.7.1.min.js

Question

I am not too familiar with jQuery.noConflict . I have tried to implement it a couple times, but I feel I am doing it wrong.

Is there a way to set a noConflict with "jquery-1.7.1.min.js"? Do I put it in the actual file, or in the header of my index or both? I have tried to follow examples but I know I am doing it wrong.

Any guidance or quick examples would help me tremendously!

Answer 1

var foo = $.noconflict();
foo('body').addClass('bar');

You can either assign it a new alias (as shown above) or call $.noConflict and only have jQuery available for use. If you chose an alias though you must use that new alias every time you want to reference jQuery.

Keep in mind though that you can enable noConflict, but still have it available when necessary using an anonymous function:

// disable $ and force use of myJQ
var myJQ = jQuery.noConflict();
(function($){
  //
  // be able to use $ within this block and have it mean jQuery
  //
  $('body').addClass('foo');
})(myJQ);

// we're outside the block, now we're back to myJQ
myJQ('body').removeClass('foo');

Answer 2

No conflict mode is easy to use. Include this shortly after loading jQuery and any jQuery-dependent libraries:

var $j = jQuery.noConflict();

Then, instead of using $ for everything, use $j :

var elements = $j('.class-name');

Answer 3

Have you tried the following examples:

http://api.jquery.com/jQuery.noConflict/

I think it says all about it. Check your browser console to see any errors.

Answer 4

I'd recommend using a noConflict call, as well as wrapping your jQuery code with an anonymous function, so you can call jQuery by $ :

jQuery.noConflict();
(function ($) {
    // Now you can use $ to call jQuery
}(jQuery));