Peter Peter - 1 month ago 5
jQuery Question

jQuery libraries, noConflict and issues with other files (webflow.js)

I'm having an issues using multiples jQuery libraries and particularly the webflow.js

So…

<script src="jquery222.js"></script>

<script type="text/javascript">var jquery222 = jQuery.noConflict( true );</script>

<script src="webflow.js"></script>


No matter the order, even if I change it does not work.

And for the file (webflow.js) I´m wrapping all inside

(function( $ ) {

})(jquery222)


I tried changing as well, inside the webflow.js ALL the jQuery with jquery222.

However, I can't do it work. Can anyone take a look particularly to the *.js file...?

UPDATE:
Console error

TypeError: r is undefined
<anonymous>
webflow.js:16
t()
webflow.js:9
<anonymous>
webflow.js:9
<anonymous>
webflow.js:9
t()
webflow.js:9
<anonymous>
webflow.js:16
t()
webflow.js:9
<anonymous>
webflow.js:9
t()
webflow.js:9
<anonymous>
webflow.js:9
<anonymous>
webflow.js:9
<anonymous>
webflow.js:1
webflow.js:16:59224


But it disappears when I just use one library (and I can´t because the CMS is using an old jQuery library by default). So the issue must be related to the noConflict use.

Answer

Based on comments by @RocketHazmat about how webflow.js sets an internal copy of window.jQuery:

In the non-minified version of webflow.js (found at https://daks2k3a4ib2z.cloudfront.net/55de95401f19df505cc6c89d/js/webflow.6ae5c75d3.js not sure how long this link will last), there's line at the top: var $ = window.jQuery; (the minified version may replace $ with something else). So, your wrapping it in a function does nothing since it resets $ to window.jQuery.

and keeping in mind that you want the older version (prepopulated in the page and outside your control) of jQuery available to the document, it seems like you'd need to do this:

<script src="jquery222.js"></script>
<script src="webflow.js"></script>
<script>
  var jquery222 = jQuery.noConflict( true );
</script>