0

我找到了很多答案(大多数与 wordpress 有关),但没有任何帮助。我是 css/jquery 的新手,所以需要我的手稍微握一下。我试过这个但无法让它工作我可以在同一页面上使用多个版本的 jQuery 吗?

我的代码在这里:

<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 由图像轮播使用。目前轮播版本超过了导航栏(消失)。

有什么想法可以解决这个冲突吗?

4

2 回答 2

2

假设需要不同的版本,并且插件是按照正确的模式编写的,请不要使用,而只是简单地定位脚本,以便插件在执行时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 非常向后兼容,几乎没有令人惊讶的变化(弃用路线图很长)。在使用遗留功能的情况下,可以使用jquery -migrate.js对旧代码进行填充更改,从而消除许多此类迁移问题。

[jQuery-migrate] 可用于检测和恢复在 jQuery 中已弃用并从 1.9 版开始删除的 API 或功能。

于 2014-08-12T16:47:56.607 回答
0

使用 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>
于 2014-08-13T09:03:52.547 回答