Question

我无法解决这个问题。我的上帝让我的大脑受伤了，所以我转向你，互联网上的好人。

我一直盯着the documentation for the jQuery $.noConflict() function而没有运气。

我的问题是我正在开发的网站已经包含了jQuery 1.1.3.1，但是我想在一些地方做一些非常棒的时髦UI工作，所以我想使用1.4.2，原因很明显。

我一直试图并排运行这些但我似乎无法获得任何代码来执行。我还需要使用1.4.2实现一些插件，所以我不确定是否将jQuery放到像$j这样的东西上，显然插件会选择$和{{1} } jQuery而不是1.1.3.1。

有没有办法可以将我的代码包装在1.4.2块中，还包含创建自包含noConflict()代码块所需的插件？

任何帮助都会很棒，因为我的可怜的头脑在API文档的广阔荒地中哭泣！

Answer 1

如果你在同一个页面中有两个或三个jQuery，只需为每个不同的jQuery添加一个不同的变量。

示例：

<script type="text/javascript">
    var $s = jQuery.noConflict();
    $s(document).ready(function() {
        $s('#news-container').vTicker({
            speed: 500,
            pause: 3000,
            animation: 'fade',
            mousePause: true,
            showItems: 2
        });
    });
</script>
<script type="text/javascript">
    var $j = jQuery.noConflict();
    $j(document).ready(function() {
        $j('.sf-menu ul').superfish({
            delay: 1000,
            animation: {
                opacity: 'show',
                height: 'show'
            },
            speed: 'medium',
            autoArrows: false,
            dropShadows: 'medium'
        });
    });
</script>

Answer 2

您只需将整个网站升级到1.4.2即可 jQuery通常不会有很多重大变化，因此不应该那么难。

Answer 3

我最近遇到过一个类似的问题，我在一个页面上使用jQuery v1.3.2但是第三方问卷弹出窗口在同一页面上使用旧版本。我最终设法解决了这个问题。我引用了jQuery 1.3.2如下：

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

然后我修改了所有jQuery代码以使用jq132而不是$。然后我在我用来替换“$（”和“jq132（”和“$。”和“jq132”的所有插件上找到并替换。可能有更优雅的方法，但这对我有用。我离jQuery专家很远，所以你可能需要处理其他$语法（即不只是“。”和“（”）。）。

Answer 4

您应该发布一个无效的示例。我敢打赌，我们马上把它清理干净。

我不相信noConflict完全是'阻止'。您使用noConflict告诉jQuery您希望它从全局JavaScript命名空间中删除它声明的任何内容（因为您想再次加载jQuery并重用这些名称）。

在加载了超过1个jQuery实例的页面上，两个实例都应该使用noConflict。我不知道是否可以加载第二个jQuery实例，如果已经加载了一个实例并且该实例没有调用noConflict。

@SLaks和@galambalazs：有时您正在编写少量内容，这些内容将显示在较大的页面中，例如门户网站。门户网站已经使用了（n过时的）jQuery版本，但是你需要一个更新的版本。此外，您不能控制较大的门户网站页面，只是您正在编写的内容将在其中显示。

此方案准确描述了我常做的实际工作。

Answer 5

我同意其他建议尝试全面升级到1.4.2的帖子......那就是说，你显然有充分的理由试图尝试做什么。据我所知，没有简单的方法来处理你的情况（因为我也尝试过类似的东西）。

“noConflict”只是释放全局“$”变量，以便其他库/脚本可以安全地使用它。鉴于您正在尝试使用两个版本的jQuery“noConflict”在这里并不真正有用...为两个版本的jQuery调用它并不会改变这两个版本仍然需要引用全局“jQuery”对象的事实（其中只能有一个...）。

问题（正如您已经清楚知道的）是加载第二个jQuery版本将“破坏”原始jQuery对象（以及插件对其进行的所有“自定义”）。

我能想出的唯一可靠（尽管效率极低）的解决方案是：

加载现有的（旧）jQuery 版本和插件（假设你不能避免这种情况）
加载新的jQuery 版本
重新加载和现有插件以及您要使用的任何新插件
广泛测试

Answer 6

一个可靠的建议：不要用两个jQuery版本来强调您和您的访问者带宽。将整个代码库更改为最新版本。它有更少错误，更多支持和更好的行为。

Answer 7

姗姗来迟......但可能会帮助某人 - 把它扔到一起。

/**
*********************************************************************************************************
*           jQuery version check
*           $.noConflict() is not enough to ensure jQuery as well as $ 
*           has correct version (can cause troubles with jQuery plugins that use fn(){}(jQuery);
*
*           useage: restoreJquery('1.10.2',true) //for unminimized dev version
*                   restoreJquery('1.10.2')          //for minimized version
*                   restoreJquery('1.10.2',true,myFunction)          //for minimized version, that executes a function once jQuery is in the page
*
*
**/

function restoreJquery(wantedVersion,devVersion,callback) {
    if(!wantedVersion){
        wantedVersion= '1.10.2';
    }

    //is current jQuery version ===wanted version? (double check to avoid undefined errors)
    if($ && $.fn.jquery!==wantedVersion){                

        //if not invoke noConflict with true (true=gives up the jQuery name space aswell as $)
        var $jQuery = jQuery.noConflict(true); 
        //Line Assign the new object to new instantiated versions of jQuery
        var $=jQuery=$jQuery;                          
      }

    //if jQuery is still not the correct version inject it into page via plain vanilla js

    //if $ does not exist or the version is wrong inject it into the page
    if(!$ || $.fn.jquery!==wantedVersion){ 

        var head=document.getElementsByTagName('head')[0], //get Head
            jqPath=wantedVersion+'jquery.', // ex '1.10.2/jquery.
                    script=document.createElement('script'); //create empty scripttag

            if(devVersion){  //minimized or not?
                jqPath+='min.js';
            }else{
                jqPath+='js';
            }

        script.src='//http://ajax.googleapis.com/ajax/libs/jquery/'+jqPath; //create src path
        script.type='text/javascript'; //add type
        script.async=true; //set async to true
        //real browsers
        script.onload=callback;  //call callback on load

        //Internet explorer doesnt support onload on script (typical ie)
        script.onreadystatechange = function() {
            if (this.readyState == 'complete') {
                callback();
            }
        }


    head.appendChild(script);

    }else{
        //otherwise call the callback since noConflict solved our jQuery versioning issues
        callback();
    }

};

Answer 8

jQuery no-conflict是jQuery团队为克服不同JS框架或库之间的冲突而给出的一个选项。当我们使用noconflict方法时，我们将$替换为新变量并分配给jQuery。

    <button>Test jQuery noConflict</button>
    <script>
        var newjq = $.noConflict();
        newjq(document).ready(function(){
           newjq("button").click(function(){
               newjq("p").text("Wahh..! Its working!");
            });
        });
    </script>

我们也可以使用下面的$符号，也不会产生任何冲突

$.noConflict();
jQuery(document).ready(function($) {
   // Code that uses jQuery's $ can follow here.
});

jQuery：noConflict

8 个答案: