Question

我正在一个网站上工作，我想使用jQuery 2.2.4和jQuery 3.1.1。我想将2.2.4版用于我的 owl carousel 2 ，但我需要3.1.1才能从 Bootstrap 4 Alpha 工作制作我的标准固定导航栏。

然而，当我同时添加以下行...

<script type="text/javascript" src="/js/jquery-2.2.4.min.js"></script> <script type="text/javascript" src="/js/jquery-3.1.1.min.js"></script>

..只有菜单有效。这是我的猫头鹰 - 旋转木马2初始化器：

  $('.owl-carousel').owlCarousel({
        loop: true,
        margin: 30,
        nav: false,
        responsiveClass: true,
        responsive: {
            0: {
                items: 1
            },
            600: {
                items: 2
            },
            1000: {
                items: 3,
                loop: false,
                dots: true
            }
        }
    })

我搜索了其他主题并遇到了noConflict（）;选项，但我不知道如何实现这一点。

所以，我需要v2.2.4用于我的旋转木马，我需要v3.1.1用于固定导航栏（没有初始化程序）。如何在不遇到问题的情况下实现这一目标？

Answer 1

是的，由于jQuery的noconflict模式，这是可能的。

<!-- load jQuery 2.2.4 -->
<script type="text/javascript" src="jquery-2.2.4.min.js"></script>
<script type="text/javascript">
var jQuery_2_2_4 = $.noConflict(true);
</script>

<!-- load jQuery 3.1.1 -->
<script type="text/javascript" src="jquery-3.1.1.min.js"></script>
<script type="text/javascript">
var jQuery_3_1_1 = $.noConflict(true);
</script>

然后，代替$（＆＃39;＃selector＆＃39;）。function（）;，你将不得不使用

jQuery_2_2_4（＆＃39;＃选择＆＃39）。函数（）;或者jQuery_3_1_1（＆＃39; #selector＆＃39;）。function（）;

Bootstrap 4如何在同一页面上使用多个jQuery版本

1 个答案: