2

我意识到关于在一个页面上使用多个 jquery 版本的问题已经有各种各样的答案，但我无法弄清楚如何应用它们。

在我的页面上，我有两个 .js 文件 - 一个用于操作可折叠菜单，第二个用于厚盒画廊。当我添加图库时，可折叠菜单停止工作。当我尝试使用下面链接中的无冲突解决方案时，菜单有效，但画廊图像将不再加载。

http://api.jquery.com/jQuery.noConflict/

关于我做错了什么的任何想法？我需要向 .html 文件和 .js 文件中添加内容吗？

代码：

<script type="text/javascript" src="../../01 Main/includes/jquery-1.6.min.js"></script>
<script type="text/javascript" src="../../01 Main/includes/main.js"></script>
<script type="text/javascript">
<div id="log">
  <h3>Before $.noConflict(true)</h3>
</div>
</script>

<script type="text/javascript" src="../scripts/jquery-latest.js"></script>
<script type="text/javascript" src="../scripts/thickbox.js"></script>
<script type="text/javascript">
var $log = $( "#log" );

$log.append( "2nd loaded jQuery version ($): " + $.fn.jquery + "<br>" );

jq16min = jQuery.noConflict(true);

$log.append( "<h3>After $.noConflict(true)</h3>" );
$log.append( "1st loaded jQuery version ($): " + $.fn.jquery + "<br>" );
$log.append( "2nd loaded jQuery version (jqlatest): " + jqlatest.fn.jquery + "<br>" );
</script>

也试过：

<script type="text/javascript" src="../../01 Main/includes/jquery-1.6.min.js"></script>
<script type="text/javascript" src="../../01 Main/includes/main.js"></script>
<script type="text/javascript">
var jQuery_1_6_min = $.noConflict(true);
</script>

<script type="text/javascript" src="../scripts/jquery-latest.js"></script>
<script type="text/javascript" src="../scripts/thickbox.js"></script>
<script type="text/javascript">
var jQuery_latest = $.noConflict(true);
</script>
4

2 回答 2

4

使用多个版本的 jquery 似乎一点也不聪明，但如果必须，您可以将其中一个版本分配给另一个全局变量，即链接到第一个版本

<script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.7.2/jquery.min.js"></script>
window._$ = jQuery;

然后加载下一个版本；

(function(){
  var newscript = document.createElement('script');
     newscript.type = 'text/javascript';
     newscript.async = true;
     newscript.src = 'https://ajax.googleapis.com/ajax/libs/jquery/1.6.1/jquery.min.js';
  (document.getElementsByTagName('head')[0]||document.getElementsByTagName('body')[0]).appendChild(newscript);
})();
于 2013-02-28T03:47:16.220 回答
3

可能重复：我可以在同一页面上使用多个版本的 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>

不得不经历同样的事情:)

于 2013-02-28T03:53:57.893 回答