我可以在同一页面上使用多个版本的jQuery吗？
我正在做的一个项目需要在客户的网页上使用jQuery。 客户将插入我们将要提供的代码块，其中包含一些<script>元素，用于在<script>创build的<iframe>中构build一个小部件。 如果他们还没有使用最新版本的jQuery，那么这个版本也会包含一个用于Google托pipe版本jQuery的<script> 。
问题是有些客户可能已经安装了旧版本的jQuery。 虽然这可能工作，如果它至less是一个相当新的版本，我们的代码确实依赖于jQuery库中最近推出的function，所以肯定会有客户的jQuery版本太旧的情况下。 我们不能要求他们升级到最新版本的jQuery。
有没有什么方法可以加载jQuery的新版本，只在我们的代码的上下文中使用，不会影响或影响客户页面上的任何代码？ 理想情况下，也许我们可以检查jQuery的存在，检测版本，如果它太旧，然后加载最新的版本，只是为了我们的代码。
我有一个想法，即将jQuery加载到客户域中的<iframe>中，该域也包含我们的<script> ，这似乎是可行的，但我希望有一个更好的方法来做到这一点（更不用说没有额外的<iframe>的性能和复杂性惩罚）。
是的，这是可行的，由于jQuery的noconflict模式。 http://blog.nemikor.com/2009/10/03/using-multiple-versions-of-jquery/
<!-- load jQuery 1.1.3 --> <script type="text/javascript" src="http://example.com/jquery-1.1.3.js"></script> <script type="text/javascript"> var jQuery_1_1_3 = $.noConflict(true); </script> <!-- load jQuery 1.3.2 --> <script type="text/javascript" src="http://example.com/jquery-1.3.2.js"></script> <script type="text/javascript"> var jQuery_1_3_2 = $.noConflict(true); </script>
然后，而不是$('#selector').function(); ，你会做jQuery_1_3_2('#selector').function(); 或者jQuery_1_1_3('#selector').function(); 。
看着这个，并试图出来，我发现它实际上不允许多个jquery的实例一次运行。 经过四处寻找，我发现这只是一个窍门，而且是less了很多代码。
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script> <script>var $j = jQuery.noConflict(true);</script> <script> $(document).ready(function(){ console.log($().jquery); // This prints v1.4.2 console.log($j().jquery); // This prints v1.9.1 }); </script>
那么在“$”之后加上“j”就是我需要做的。
$j(function () { $j('.button-pro').on('click', function () { var el = $('#cnt' + this.id.replace('btn', '')); $j('#contentnew > div').not(el).animate({ height: "toggle", opacity: "toggle" }, 100).hide(); el.toggle(); }); });
取自http://forum.jquery.com/topic/multiple-versions-of-jquery-on-the-same-page ：
- 原始页面加载他的“jquery.versionX.js” –
$和jQuery属于版本X。 - 你可以调用你的“jquery.versionY.js” – 现在
$和jQuery属于versionY，而_$和_jQuery属于versionX。 -
my_jQuery = jQuery.noConflict(true);– 现在$和jQuery属于versionX，_$和_jQuery可能是null，my_jQuery是versionY。
你可以在你的页面上拥有许多不同的jQuery版本。
使用jQuery.noConflict() ：
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.8.3/jquery.min.js" type="text/javascript"></script> <script> var $i = jQuery.noConflict(); alert($i.fn.jquery); </script> <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script> var $j = jQuery.noConflict(); alert($j.fn.jquery); </script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js"></script> <script> var $k = jQuery.noConflict(); alert($k.fn.jquery); </script>
DEMO | 资源
有可能加载第二版本的jQuery使用它，然后恢复到原始或保留第二版本，如果没有jQuery加载之前。 这里是一个例子：
<script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.8.2/jquery.min.js"></script> <script type="text/javascript" src="http://ajax.googleapis.com/ajax/libs/jquery/1.6.4/jquery.min.js"></script> <script type="text/javascript"> var jQueryTemp = jQuery.noConflict(true); var jQueryOriginal = jQuery || jQueryTemp; if (window.jQuery){ console.log('Original jQuery: ', jQuery.fn.jquery); console.log('Second jQuery: ', jQueryTemp.fn.jquery); } window.jQuery = window.$ = jQueryTemp; </script> <script type="text/javascript"> console.log('Script using second: ', jQuery.fn.jquery); </script> <script type="text/javascript"> // Restore original jQuery: window.jQuery = window.$ = jQueryOriginal; console.log('Script using original or the only version: ', jQuery.fn.jquery); </script>
我想说，你必须总是使用jQuery最新或最近的稳定版本。 但是，如果您需要与其他版本一起工作，那么您可以添加该版本并将$重命名为其他名称。 例如
<script src="http://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js" type="text/javascript"></script> <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.4.2/jquery.min.js" type="text/javascript"></script> <script>var $oldjQuery = $.noConflict(true);</script>
看这里，如果你用$写东西，那么你会得到最新版本。 但是，如果你需要用旧的做任何事情，只需使用$oldjQuery而不是$ 。
这是一个例子
$(function(){console.log($.fn.jquery)}); $oldjQuery (function(){console.log($oldjQuery.fn.jquery)})
演示
当然可以。 此链接包含有关如何实现该function的详细信息： https ： //api.jquery.com/jquery.noconflict/ 。
