CODEWITHSUNDEEP
jquery
Gandalf
Gandalf

Reputation: 3257

How to assign jquery with specific version for a library, when multiple jquery versions exists?

Let's say i am using 3 different versions of jquery(1.3, 1.5, 2.3) in index.html. And i am using a CSS framework which uses jquery 1.3(and of course in that css framework $ symbol has been used as alias for jQuery. Is there anyway that i can tell the CSS framework to use the 1.3 jquery, without modifying js files of that framework, using noconflict mode and changing every occurrence of $ symbol in that framework's js files to $j(assuming i have create this variable $j = noconflict() ) ?

Upvotes: 0

Views: 1277

Answers (1)

T.J. Crowder
T.J. Crowder

Reputation: 1074148

If the CSS framework is written half-properly, you do it like this:

<script src="jquery-1.3.js"></script>
<script src="the-css-framework.js"</script>
<script>
var jq1_3 = jQuery.noConflict();
</script>
<script src="jquery-up-to-date.js"></script>

The CSS framework will (if it's written half-properly) grab the then-current version of jQuery and use that in its code. If you need to use it in your code, you do that with jq1_3, not $.

Here's an example with jQuery 1.11, loading the SimpleModal plugin into it, then loading jQuery 2.2.4. We can use SimpleModal with jQuery 1.11, but not with jQuery 2.2.4:

// Works
jq1_11.modal("<div>Hi there jQuery 1.11</div>");

// Fails, the plugin isn't loaded on this version
try {
  $.modal("<div>Hi there jQuery 2.2.4</div>");
} catch (e) {
  console.log("Error: " + e.message);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/simplemodal/1.4.4/jquery.simplemodal.min.js"></script>
<script>
var jq1_11 = jQuery.noConflict();
</script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/2.2.4/jquery.js"></script>

But that's a workaround. The fix is to not spend time dealing with the problems loading multiple copies of jQuery causes, but instead spend that time standardizing and updating your various libs to use a single, up-to-date version of jQuery. Sometimes that's not possible in the short-term and you have to work around things, but it should be the primary goal.

Upvotes: 1

Related Questions