Is there a way to use bootstrap 3.0 plugins with jQuery.noConflict()?

Question

We are currently loading 2 different versions of jQuery on our page, 1.4.2 and 1.10.1. The $ and window.jQuery objects are currently pointing to 1.4.2.

We are using noConflict() with version 1.10.1 to set it to $jq1:

var $jq1 = jQuery.noConflict(true);

Is there any way to get Bootstrap 3.0 plugins to automatically use $jq1 instead of $ or window.jQuery?

Answer 1

If you load the bootstrap JS straight after loading jQuery version 1.10.1 and then put jQuery into no conflict mode, it should work.

e.g.:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<!-- Load any Bootsrap JS files before calling jQuery.noConflict()  -->
<script src="bootstrap.js"></script>
<script>
// Put jQuery 1.10.2 into noConflict mode.
var $jq1 = jQuery.noConflict(true);
</script>

<!-- This can be before or after the above -->
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script>

jQuery.noConflict(true) will reassign both $ and jQuery to their previous values so it doesn't matter if version 1.4.2 is loaded first or not.

It does mean your users will be downloading jQuery twice though and you will need to remember if to use $jq1 or $ when doing anything with jQuery.