Older version conflicting with newer version of jquery

Question

I am stuck in a major issue with jquery plugins. I have some code written with jquery 1.7.1, now I started using bootstrap and that need 1.9.1 jquery plugin or higher.

Answer 1

When you load your jQuery.x.x.js, it will overwrite the existing $ and jQuery vars. BUT it keeps a backup copy of them (in _$ and _jQuery). Calling noConflict(true) you restore the situation as it was before your js inclusion!

noConflict() gives you the running instance (the last loaded), so you can work with you version in this way

Resuming:

• original page loads his "jquery.versionX.js"
• $ and jQuery belong to versionX
• you call your "jquery.versionY.js"
• now $ and jQuery belong to versionY, plus _$ and _jQuery that belongs to versionX
• var my_jQuery = jQuery.noConflict(true);
• now $ and jQuery belong to versionX, _$ and _jQuery are probably null, and my_jQuery is versionY

If you want to revert back to a specific version add following JavaScript code in HTML.

<script type="text/javascript">
    if (jQuery.fn.jquery != "1.11.0")
        var jQuery_1_11_0 = $.noConflict(true);
</script>

Answer 2

You can try loading just the newer version of jQuery then loading jquery-migrate which will restore some old functionality. However, without knowing what specific features your app needs, I can't be sure that this will solve the problem.

https://cdnjs.cloudflare.com/ajax/libs/jquery-migrate/1.2.1/jquery-migrate.min.js

Ideally though, you should really identify the code that relies on older versions of jQuery and update them to work with the newest version. At the end of the day, the changes to jQuery were made for a reason. And you're almost certainly better off with the new implementations.

If you smartly decide to update your code, the jQuery Core 1.9 Upgrade Guide would likely be a good place to start