一起使用不同版本的jQuery和jQueryUI [英] Using different versions of jQuery and jQueryUI together

问题描述

我正在一个项目中，他们的框架使用jQuery 1.3.2和jQueryUI 1.7.2.

I am working on a project where their framework uses jQuery 1.3.2 and jQueryUI 1.7.2.

不可能在框架中升级版本，所以我想并行运行jQuery 1.4.4和jQueryUI 1.8.5.

Upgrading the versions in the framework is not a possibility so i wanted to run jQuery 1.4.4 and jQueryUI 1.8.5 in parallel.

我已经看到可以像这样并行使用不同版本的jQuery:

I have seen that different versions of jQuery can be used in parallel like so:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>  
    <script type="text/javascript">
        var j$132 = $.noConflict(true);
    </script>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
    <script type="text/javascript">
        var j$144 = $.noConflict(true);
    </script>

但这对于以下情况也适用:

But would this also hold true for the following:

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.7.2/jquery-ui.min.js"></script> 
    <script type="text/javascript">
        var j$132 = $.noConflict(true);
    </script>

    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
    <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jqueryui/1.8.5/jquery-ui.min.js"></script>
    <script type="text/javascript">
        var j$144 = $.noConflict(true);
    </script>

推荐答案

AFAIK，jQuery UI没有等效的$.noConflict().但是，您可以使用jQuery UI的本地副本，并使用与别名不同库相同的技巧来包装整个JS:

AFAIK, there's no $.noConflict() equivalent for jQuery UI. You can, however, use a local copy of jQuery UI and wrap the whole JS using a similar trick to what you use for aliasing the different libraries:

(function(jQuery) {
  // ... the jQuery UI lib code for jQuery 1.3.2
})(j$132);

可以使用服务器端构建脚本或提供JS文件但使用上述代码包装内容的处理程序来优雅地实现这一点.

This could be elegantly implemented using a server-side build script or a handler that serves the JS files but wraps the contents with the above code.

还没有测试过这种方法，因此您可能不得不摆弄函数参数(尽管我认为可以安全地假设它在插件代码中使用jQuery来引用jQuery).

Haven't tested this approach, so you may have to fiddle around with the function parameter (although I think it's safe to assume it uses jQuery to reference jQuery within the plugin code).

使用此方法的方式是声明两个版本的jQuery:

The way you'd use this is declare both versions of jQuery:

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.3.2/jquery.min.js"></script>  
<script type="text/javascript">
    var j$132 = $.noConflict(true);
</script>

<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.3/jquery.min.js"></script>
<script type="text/javascript">
    var j$144 = $.noConflict(true);
</script>

...，然后按照上面的说明添加您的UI代码.

... and then include your UI code, as I've specified above.

不，您不能在引用Google CDN的UI JS文件时执行此操作.

And no, you can't do this while referencing the UI JS files from Google CDN.

问题中的第二个代码块实际上是比这个答案更好的解决方案，因为它不需要将原始UI代码包装在一个自动执行的函数中并传递特定的版本.两种方法的确在页面上产生完全相同的状态.

The second code block in the question is actually a better solution than this answer, since it doesn't require wrapping the original UI code in a self-executing function and passing the specific version. Both approaches do result in exactly the same state on the page.

这篇关于一起使用不同版本的jQuery和jQueryUI的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！