Master Slave
Master Slave

Reputation: 28549

Handling multiple jQuery versions conflicts when loading jQuery to third-party pages

I'm creating some JavaScript, mainly jQuery based widgets that are suppose to work on third-party pages. To simplify embedding and maintenance of the widgets, we are asking users to embed only one <script> element snippet that downloads a JavaScript file from our server which further downloads all the CSS and JavaScript needed for widget to run, and places them in head of the third-party page.

My problem happens with pages that already have jQuery, which is one of the dependent JavaScript. Our widget uses var jQuery_1_6 = jQuery.noConflict(true) which is set right after jQuery is loaded, however, in the script that check whether jQuery is loaded we use the following if (typeof jQuery == 'undefined') and if (typeof jQuery.ui == 'undefined').

Now the thing is if there is already jQuery and jQuery.ui on the page, the ifs will not load jQuery version, which (I guess) causes jQuery_1_6 = jQuery.noConflict(true) not to work.

Any ideas how to apply noConflict on already loaded jQuery? Would it help to append again the nodes that already loaded jQuery, and if so, how to figure out which .js file hosts jQuery code?

Upvotes: 3

Views: 3587

Answers (1)

Related Questions