另一个相互冲突的jquery问题

Question

我已经找到了大量的答案(大多数是关于wordpress的)，但没有一个是非常有帮助的。我是css/jquery的新手，所以我需要一点帮助。我试过了，但不能让它工作Can I use multiple versions of jQuery on the same page?

我的代码如下：

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1/jquery.min.js"></script>
<script src="js/jquery.slicknav.js"></script>
<script type="text/javascript">
$(document).ready(function(){
    $('#menu').slicknav();
});
</script>

<script src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
<script type="text/javascript">
    var jQuery_1_7_2 = $.noConflict(true);
</script>
<script>window.jQuery || document.write('<script src="js/jquery-1.7.2.min.js"><\/script>')     
</script>

<script src="js/jquery-1.9.1.min.js"></script>
<script type="text/javascript">
  var jQuery_1_9_1 = $.noConflict(true);
</script> 
<script src="js/owl.carousel.js"></script>

我在我的页面上使用了两个元素的源代码，一个叫做jquery-1.7.2.min.js，另一个叫做jquery-1.9.1.min.js。

1.7.2控制我的响应式导航栏，而1.9.1由图像轮播使用。此时，carousel版本推翻了导航栏(消失)。

你知道我该怎么解决这个冲突吗？

Answer 1

假设需要不同的版本，并且插件是按照the correct pattern编写的，请不要使用noConflict，而是简单地定位脚本，以便插件在执行时可以访问正确的window.jQuery。

<script src="js/jquery-1.7.2.min.js"></script>
<!-- plugins that "only work with" 1.7.2: $/jQuery refer to 1.7.2 -->
<script src="js/jquery.slicknav.js"></script>

<script src="js/jquery-1.9.1.min.js"></script>
<!-- everything else: $/jQuery refer to 1.9.1 (but consider 1.11+) -->
<script src="js/owl.carousel.js"></script>

在noConflict中使用不同的名称的用法是，知道不同名称的代码可以使用它-这不是标准插件的情况。

然而，考虑简单地使用最新的1.x (目前是1.11.1)来处理所有的插件，因为jQuery是非常向后兼容的，几乎没有什么令人惊讶的变化(弃用路线图很长)。在使用遗留功能的情况下，there is to shim changes for older code可以消除许多此类迁移问题。

jQuery-migrate可用于检测和恢复在jQuery中已被弃用并从1.9版起删除的API或特性。

Answer 2

使用1.9.1的工作代码。将使用1.11进行实验

<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<script src="js/jquery.slicknav.js"></script>
<script type="text/javascript">
   $(document).ready(function(){
       $('#menu').slicknav();
   });
</script>
<script src="js/owl.carousel.js"></script>