0

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.

mikancode
  • 37
  • 6
  • So why are you loading 2 versions in the first place? Most likely both of those plugins would work using a common version – charlietfl Apr 03 '19 at 16:05
  • 1
    Your noconflict need to be before your first jquery otherwise your second will override the first and then be set to no conflict – Pete Apr 03 '19 at 16:05
  • Possible duplicate of [Can I use multiple versions of jQuery on the same page?](https://stackoverflow.com/questions/1566595/can-i-use-multiple-versions-of-jquery-on-the-same-page) – Pete Apr 03 '19 at 16:06
  • Yes it is possible see answer here : https://stackoverflow.com/questions/1566595/can-i-use-multiple-versions-of-jquery-on-the-same-page – cdrck Apr 03 '19 at 16:06

1 Answers1

1

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.

Rory McCrossan
  • 331,213
  • 40
  • 305
  • 339