0

I'm very new to jQuery and I've looked at many problems out there. And mostly might worked for them but not for me. The problem is about using multiple jQuery in the same page. Here is my code in head tag.

<!-- load jQuery 1.8.2) -->
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>
<!-- bxSlider Javascript file -->
<script src="assets/scripts/bxslider/jquery.bxslider.min.js"></script>
<!-- bxSlider CSS file -->
<link href="assets/scripts/bxslider/jquery.bxslider.css" rel="stylesheet" />

<script>
var jQuery_1_8_2 = $.noConflict(true);
</script>

<!-- fullBackground -->
<script src="assets/scripts/fullbg/jquery.fullbg.min.js"></script>
<!-- load jQuery 1.5.0 -->
<script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/jquery/1.5.0/jquery.min.js"></script>

<script>
var jQuery_1_5_0 = $.noConflict(true);
</script>

I'm so confused what's wrong with this. If I use one of them, it's working but after I put both, it's not working at all. Does any of you have solution for this? Thanks.

Anthosiastic
  • 69
  • 1
  • 10
  • 3
    Why do you need multiple jQuery? This is a very bad idea. – zero298 Jan 07 '14 at 17:04
  • 1
    That's because you shouldn't load two jQuery versions. There is ***no reason*** you should need two versions. – War10ck Jan 07 '14 at 17:04
  • 2
    This is soooo bad, don't use different versions of jQuery in the same "javascript" envrionment – Noam Rathaus Jan 07 '14 at 17:04
  • @War10ck So if I want to use a plugin that is compatible with jQuery 1.4 but not jQuery 1.9, how do I go about that? – Kevin Bowersox Jan 07 '14 at 17:08
  • One jQuery for slider and another one for fullbackground. I didn't realise that was very bad idea. Should I combine or what should I do? Is one version enough to use for both? – Anthosiastic Jan 07 '14 at 17:08
  • I tried to use that method @CDspace gave but it's not working either. :/ – Anthosiastic Jan 07 '14 at 17:11
  • @KevinBowersox Beside the fact that said plugin is outdated, it seems like an awful lot of overhead to incur just to load a single plugin and an unwarranted reason to load two jQuery libraries. That being said, if you have to support the ancient plugin, then I would suggest loading a jQuery 1.8.x copy from a CDN. This would allow your plugin to function and provide you a semi-up-to-date version of the library. – War10ck Jan 07 '14 at 17:17
  • @Anthosiastic I tried this and it didn't work when I loaded the html document from file because it couldn't find the first jQuery as the scheme of the URL is not defined and so took file:// from the parent. Adding a scheme to the first URL fixes this. Eg https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js – tarn Jan 07 '14 at 17:18
  • @Anthosiastic Based on your more recent comment, yes one jQuery should be fine :) – tarn Jan 07 '14 at 17:21
  • @tarn thanks for reply. I tried to use one of the versions to make both working, but it's not working at all. One is working only for full background, but another one is only working for bxslider. I hope I can get one jQuery to get them working. But i couldnt find any. – Anthosiastic Jan 07 '14 at 17:24
  • @War10ck There are reasons. Perhaps you want to use a newer jQuery for something in a CMS that includes a very old version on every page. Perhaps you are writing a script that is intended to be embedded in other peoples pages (eg. disqus comments) and want to use a jQuery but not break any jQuery already on the page. Or you have some plugin you don't want to or are unable to update. – tarn Jan 07 '14 at 17:36
  • @tarn I understand the point you are trying to make. However, I still feel that under no circumstances should you include two jQuery libraries. If you are writing code for others to use and it uses jQuery, it should be marketed as a plugin. It should not include it's own copy of jQuery. As far as the CMS issue goes, it would be time for an upgrade. I will be the first one to tell you that it is a pain. I had to do it for my production site. However, by using the resources provided by jQuery and following their documentation, I was able to upgrade my CMS to use the lastest jQuery version. – War10ck Jan 07 '14 at 18:59

1 Answers1

1

This should work.

However if the html document is opened from file it won't because the scheme of the first jQuery URL is not defined and so it takes file:// from the parent. As there is probably no local file of this name it does not load and the $ is not defined. Calling the first $.noConflict() function then fails with $ not defined.

Adding a scheme to the first URL fixes this. 

 <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script>

The reason the scheme is often omitted is so it will use http:// or https:// depending on the what the page is using, which is generally a good thing.

One way to serve a html document over HTTP locally is by running a simple Python HTTP server from the same directory.

python -m SimpleHTTPServer

You can then open your page in your browser at http://localhost:8000/ and your example should work.

tarn
  • 2,192
  • 2
  • 13
  • 17