一起使用不同版本的jQuery和jQueryUI

Rya*_*P13 26 jquery jquery-ui

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

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

我已经看到不同版本的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>
Run Code Online (Sandbox Code Playgroud)

但这也适用于以下情况:

    <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>
Run Code Online (Sandbox Code Playgroud)

Kle*_*vič 12

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

(function(jQuery) {
  // ... the jQuery UI lib code for jQuery 1.3.2
})(j$132);
Run Code Online (Sandbox Code Playgroud)

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

没有测试过这种方法,所以你可能不得不摆弄函数参数(虽然我认为可以安全地假设它用于jQuery在插件代码中引用jQuery).

你使用它的方式是声明两个版本的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>
Run Code Online (Sandbox Code Playgroud)

...然后包括您的UI代码,如上所述.

不,在引用Google CDN的UI JS文件时,您无法执行此操作.

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

  • 这完全违背了包装器的目的,即在调用`jQuery.noConflict(true)`之前捕获对`jQuery`的引用.jQuery UI旨在支持这种开箱即用.问题中提议的实施实际上是正确的,并且工作得很好. (3认同)