Jquery conflicting using 2 libraries and same function

Question

I am very new to jquery and have been working on some snippets I found online. I have reached a problem where I think because I have 2 different jquery libraries called to the page and 2 functions both using $(function) are causing the page not to work. I've tried using the no.conflict option but not sure I used this properly or missed something out elsewhere. Would appreciate if someone can explain or tell me what the solution would be? Thanks in advance.

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script src="jquery.revolution.js"></script>

</head>
<body>
<div id="overlay"></div>
<div id="container">

<div id="jstwitter"></div>

<script type="text/javascript" >
  $(function() { 
   $('#container').revolution(); 
    });
</script>
</body>


<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript" src="nested.jstwitter.js"></script>
<script type="text/javascript" src="automate.js"></script>
<script type="text/javascript" src="base.js"></script>
<script type="text/javascript">
$(function () {
    // start jqtweet!
    JQTWEET.loadTweets();
}); 
</script>

</html>

You should NEVER have to call it twice, there's no point and it can cause all sorts of problems - pls explain why you are? and why they are different versions at that — StudioTime, Dec 29 '15 at 11:44
Better to use qualified names for different versions of jquery on same page. — Parkash Kumar, Dec 29 '15 at 11:44
http://stackoverflow.com/questions/1327756/can-you-have-multiple-document-readyfunction-sections — Pierre Emmanuel Lallemant, Dec 29 '15 at 11:46
Please have a look at [this](http://stackoverflow.com/questions/7882374/how-do-i-implement-jquery-noconflict) may fill your purpose — srinatht, Dec 29 '15 at 11:50

score 1 · Answer 1 · answered Dec 29 '15 at 11:51

Don't know why do you need two versions, but you can try something like this:

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
<script type="text/javascript">
var jQuery_1_10_2 = $.noConflict(true);
</script>

<script type="text/javascript" >
(function( $ ) {
    $('#container').revolution(); 
})( jQuery_1_10_2 );
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js" type="text/javascript"></script>
<script type="text/javascript">
var jQuery_1_8_2 = $.noConflict(true);
</script>

<script type="text/javascript" >
(function( $ ) {
    JQTWEET.loadTweets();
})( jQuery_1_8_2 );
</script>

score 0 · Answer 2 · answered Dec 29 '15 at 11:46

0

Could you not just combine them?

<script type="text/javascript"> 
$(function () {

    // Container Revolution
    $('#container').revolution(); 

    // start jqtweet!
    JQTWEET.loadTweets();

}); 
</script>

answered Dec 29 '15 at 11:46

Danomanic

1

Also, remove `jquery-1.8.2` as well, if the `revolution.js` and `nested.jstwitter.js` can be initialized using `1.10.2`. If not, then use qualified names for different versions of jquery to resolve conflict. – Parkash Kumar Dec 29 '15 at 11:48

Jquery conflicting using 2 libraries and same function

2 Answers2