jQuery No Conflict 仍然与其他版本的 jQuery 冲突

Question

我正在尝试将双滑块插件与 estalge 视图框一起运行。它们都使用 jQuery，并且单独工作，但是当我将它们放在一起时，一个中断。我曾尝试实施 jQuery 无冲突规则，但我认为我可能在某处遗漏了一个小细节。到目前为止，我的编码看起来像：

<script src="scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="scripts/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="scripts/jquery.timers-1.2.js" type="text/javascript"></script>
<script src="scripts/jquery.dualSlider.0.3.js" type="text/javascript"></script>
<!-- START ESTALGE -->
<script src="js/jquery-1.6.2.min.js"></script>
<script src="js/jquery.etalage.min.js"></script>

<script type="text/javascript"> 

  $.noConflict();
  jQuery(document).ready(function($) {
                jQuery('#etalage').etalage();
            });

    $(".carousel").dualSlider({
                auto:true,
                autoDelay: 6000,
                easingCarousel: "swing",
                easingDetails: "easeOutBack",
                durationCarousel: 1000,
                durationDetails: 500

            });

    </script>

任何帮助将不胜感激。谢谢你

Answer 1

您错误地使用了noConflict。

<script src="scripts/jquery-1.3.2.min.js" type="text/javascript"></script>

<!-- INCLUDE ANY SCRIPTS HERE THAT RELY ON 1.3.2 -->

<script type="text/javascript"> 
    // HERE WE CAN USE 1.3.2

    // re-assign 1.3.2 to a new variable so we can use it later
    var $jq132 = $.noConflict();
</script>

<script src="js/jquery-1.6.2.min.js"></script>

<script type="text/javascript"> 

    // $ is now 1.6.2 and $jq132 is 1.3.2, both can be used.

</script>

Answer 2

您可以有多个 jQuery 版本，$.noConflict 将返回您的 jQuery 对象。您需要将其另存为另一个变量。

<script src="scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
<script src="js/jquery-1.6.2.min.js"></script>
<script>
    $jq = $.noConflict();
    // $jq is jQuery 1.6.2
    // $ is jQuery 1.3.2
</script>

演示：http://jsbin.com/uhazan/3/edit#javascript,html,live

注意：jQuery 变量将设置为 1.6.2（第二个），如果您希望它为 1.3.2（第一个），请将 true 传递给 $.noConflict。

附：您可能希望将您的$(".carousel").dualSlider 放入$(document).ready(。

Answer 3

尝试将您的slider 放入jQuery(document).ready(function($) {});

来自所有者site

Etalage 是否支持 jQuery 无冲突模式？

插件本身没有冲突准备。只需将"$" 替换为您启动插件的"jQuery"，如下所示：

jQuery(document).ready(function(){
    jQuery('#etalage').etalage();
});

Answer 4

你不需要两个 jQuery Core Lib 包含

试试这个：

<script src="scripts/jquery-1.6.2.min.js" type="text/javascript"></script>
<script src="scripts/jquery.easing.1.3.js" type="text/javascript"></script>
<script src="scripts/jquery.timers-1.2.js" type="text/javascript"></script>
<script src="scripts/jquery.dualSlider.0.3.js" type="text/javascript"></script>
<!-- START ESTALGE -->
<script src="js/jquery.etalage.min.js" type="text/javascript"></script>

<script type="text/javascript"> 

 jQuery(document).ready(function($) {

 jQuery('#etalage').etalage();
 jQuery(".carousel").dualSlider({
            auto:true,
            autoDelay: 6000,
            easingCarousel: "swing",
            easingDetails: "easeOutBack",
            durationCarousel: 1000,
            durationDetails: 500

        });
});
</script>

Answer 5

如果你必须使用多个版本的 jquery 然后使用

<script src="scripts/jquery-1.3.2.min.js" type="text/javascript"></script>
<script>
    var jq132 = jQuery.noConflict();
</script>
<script src="js/jquery-1.6.2.min.js"></script>

现在调用旧版本的 jquery 像

jq132('element').doSomething();

以及较新版本的jquery可能如下

$('element').doSomething();

Answer 6

$(".carousel").dualSlider({ 行在jQuery(document).ready() 函数之外，我很确定这不是您的意图。目前，这可行：

jQuery.noConflict();
jQuery(document).ready(function($) {
    $('#etalage').etalage();

    $(".carousel").dualSlider({
        auto:true,
        autoDelay: 6000,
        easingCarousel: "swing",
        easingDetails: "easeOutBack",
        durationCarousel: 1000,
        durationDetails: 500
    });
});

但是，您的代码还存在其他问题。您引入了两个版本的 jQuery，其中一个非常旧（1.3.2）。你不会得到好的结果。如果有一些依赖于旧 jQuery 的库，请考虑不使用该库。无论如何，它可能无法在此页面上正常工作，因为该库的任何运行时活动都只能访问 jQuery 1.6。 jQuery .noConflict docs 提到您可以提供布尔值 true 作为 .noConflict 的参数以释放 jQuery 关键字，但是到那时，您加载的插件已经在旧版本附近关闭。