Note that there are some explanatory texts on larger screens.

plurals
  1. PO
    text
    copied!<ol> <li>load jQuery 1.4</li> <li>load all plugins which need to use 1.4</li> <li>use <code>noConflict</code></li> <li>load jQuery 1.6</li> </ol> <p>The problem is that jQuery plugins tend to be written this way:</p> <pre><code>(function($) { // plugin code using $ for jQuery calls })(jQuery) </code></pre> <p>i. e. they have an internal copy of whatever <code>window.jQuery</code> was at the time the plugin loaded, and you cannot change that afterwards.</p> <p><strong>update:</strong> a little more detail on how <code>noConflict</code> works (was too long for the comments). When you load jQuery, it creates an object containing all its functions and data, and sets <code>window.$</code> and <code>window.jQuery</code> to that object. The old value of <code>window.$</code> and <code>window.jQuery</code> is saved in the object.</p> <p>When you call <code>noConflict</code>, it restores the saved value (by default for <code>$</code>; if you call it with <code>true</code>, also for <code>jQuery</code>). This is useful if you had something in those variables <em>before</em> loading jQuery, and don't want it to be overwritten. E.g. if you loaded things like this:</p> <ol> <li>load jQuery 1.6</li> <li>load jQuery 1.4</li> <li>call <code>noConflict(true)</code></li> </ol> <p>then the first step would put jQuery 1.6 into <code>$</code> and <code>jQuery</code>, the second would overwrite them with 1.4, and <code>noConflict</code> would restore <code>$</code> and <code>jQuery</code> to the 1.6 version. </p> <p>But since you load 1.4 first, and call <code>noConflict</code> between the two, the old value for <code>$</code> and <code>jQuery</code> which is restored is <code>undefined</code>, which is not particularly useful, and will be overwritten by 1.6 anyway, so the <code>noConflict</code> call does not do anything useful beyond returning the value of <code>$</code> which then can be stored by some other name (<code>$mc</code> in this case). <code>var $mc = $;</code> would work just as well for that.</p> <p>As for the plugins, the auto-executing function copies the value of <code>window.jQuery</code> at the moment the plugin is loaded, and it does not matter at all what happens to <code>window.jQuery</code> afterwards:</p> <pre><code>window.jQuery = 'foo'; (function($) { window.fun = function () { console.log($); } })(jQuery); window.jQuery = 'bar'; fun(); // will log 'foo' </code></pre>
 

Querying!

 
Guidance

SQuiL has stopped working due to an internal error.

If you are curious you may find further information in the browser console, which is accessible through the devtools (F12).

Reload