CODEWITHSUNDEEP
jquery
mikancode
mikancode

Reputation: 37

my multiple versions of jQuery doesn't work

I would like to use multiple versions of jQuery on the same page. I wrote below but two scripts doesn't work. Could you teach me what is worong my code pleaes?

<script type="text/javascript" src="//jpostal-1006.appspot.com/jquery.jpostal.js"></script>
<script type="text/javascript" src="//code.jquery.com/jquery-2.1.0.min.js"></script>

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<script type="text/javascript">    
var $330 = $.noConflict(true);
</script>

Here is my whole JS part

https://jsfiddle.net/blueink/8m7oLzsf/1/

one is postal code script which uses jquery-2.1.0.min.js and jpostal.js second script is livesearch which uses 3.3.0.

Upvotes: 0

Views: 62

Answers (1)

Rory McCrossan
Rory McCrossan

Reputation: 337560

The problem is because you need to call $.noConflict() on the first instance of jQuery before you add the second. Therefore if you want to keep $ as a reference to 2.1.0, add that second.

Also note that your reference to jquery.jpostal.js, which relies on jQuery, needs to be placed after both of these references.

<script src="https://cdnjs.cloudflare.com/ajax/libs/jquery/3.3.0/jquery.min.js"></script>
<script type="text/javascript">
  var $330 = $.noConflict(true);
</script>
<script type="text/javascript" src="//code.jquery.com/jquery-2.1.0.min.js"></script>
<script type="text/javascript" src="//jpostal-1006.appspot.com/jquery.jpostal.js"></script>

<!-- Just for demonstration purposes -->
<script>
  console.log($.fn.jquery)
  console.log($330.fn.jquery);
</script>

With all of that said, requiring multiple versions of jQuery in one site is far from ideal, and will become a maintenance problem in the future. Your time would be well spent addressing the issues you have upgrading to the latest version.

Upvotes: 1

Related Questions