Javascript 在一个页面上包含两个版本的jQuery,而不影响旧插件

Javascript 在一个页面上包含两个版本的jQuery,而不影响旧插件,javascript,jquery,drupal,jquery-plugins,drupal-theming,Javascript,Jquery,Drupal,Jquery Plugins,Drupal Theming,我们的drupal站点使用jQuery 1.2.1版运行,但我们尚未升级 问题是: 我们需要添加一个名为jQuery Tokeninput的新插件,但它只在最新的jQuery版本中工作。我们尝试用旧版本添加最新的jQuery版本,但它会产生奇怪的结果 我的问题是,如何在不影响旧jQuery插件的情况下包含最新的jQuery文件 方法#1:(推荐) 你可以这样做: <script type='text/javascript' src='js/jquery_1.7.1.js'></

我们的drupal站点使用jQuery 1.2.1版运行,但我们尚未升级

问题是:

我们需要添加一个名为jQuery Tokeninput的新插件,但它只在最新的jQuery版本中工作。我们尝试用旧版本添加最新的jQuery版本,但它会产生奇怪的结果

我的问题是,如何在不影响旧jQuery插件的情况下包含最新的jQuery文件

方法#1:(推荐)

你可以这样做:

<script type='text/javascript' src='js/jquery_1.7.1.js'></script>   
<script type='text/javascript'>  
 // In case you wonder why we pass the "true" parameter,
 // here is the explanation:
 //   - When you use jQuery.noConflict(), it deletes
 //     the "$" global variable.
 //   - When you use jQuery.noConflict(true), it also
 //     deletes the "jQuery" global variable.
 var $jq = jQuery.noConflict(true);  
</script>  
<script type='text/javascript' src='js/jquery_1.2.1.js'></script> 
方法#2:(可能会破坏你网站上的东西-不推荐)

template.php
文件中:

<?php
function {theme_name}_preprocess(&$vars, $hook) {
if (arg(0) != 'admin' && $hook == "page") {
// Get an array of all JavaScripts that have been added
$javascript = drupal_add_js(NULL, NULL, 'header');

// Remove the original jQuery library
unset($javascript['core']['misc/jquery.js']);

// Add in our new jQuery library
// We do it this way to keep the includes in the same order
$core = array(
//Alternative jQuery
drupal_get_path('theme', '{theme_name}').'/js/libs/jquery-1.7.1.min.js' => array(
'cache' => TRUE,
'defer' => FALSE,
)
);

// Merge back into the array of core JavaScripts
$javascript['core'] = array_merge($javascript['core'], $core);

// Rerender the block of JavaScripts
$vars['scripts'] = drupal_get_js(NULL, $javascript);
}
}

正如您所知,有一种方法可以为您更新jQuery版本,而无需编写代码。如果感兴趣的话,可以查看一下,但我不认为该模块保留了旧的jQuery版本,而是用新版本替换它


我还建议您尝试升级jQuery版本,只使用最新版本,看看它是否真的破坏了其他功能。

下面的脚本

  • 与预先存在的脚本完全向后兼容

  • 应该没有副作用(除了添加额外JS下载的明显副作用)

  • 允许任何顺序的任何版本的jQuery——您可以让“默认”为jQuery的旧版本,“附加”为新版本,反之亦然
如何在同一页面上使用两个版本的jQuery

//将原始jQuery版本保存到另一个变量
var$Original=jQuery.noConflict(true);
//将新jQuery版本保存到另一个变量
var$v1_11_0=jQuery.noConflict(true);
//在$和jquery上替换原始的jquery版本,这样预先存在的脚本就不会中断
//无需在此处声明“var”,因为$和jQuery仍然作为“未定义”存在
$=$原件;
jQuery=$Original;
//可选:在这里,我将新的jQuery版本保存为“$”方法——它使它更具组织性(在我看来)
$.v1_11_0=$v1_11_0;
请在此处查看它的实际操作:

下面是可以放入HTML文件中进行测试的整个HTML

jQuery中的jQuery
h1 span{font-weight:normal;}
//将原始jQuery版本保存到另一个变量
var$Original=jQuery.noConflict(true);
//将新jQuery版本保存到另一个变量
var$v1_11_0=jQuery.noConflict(true);
//在$和jquery上替换原始的jquery版本,这样预先存在的脚本就不会中断
//无需在此处声明“var”,因为$和jQuery仍然作为“未定义”存在
$=$原件;
jQuery=$Original;
//可选:在这里,我将新的jQuery版本保存为“$”方法——它使它更具组织性(在我看来)
$.v1_11_0=$v1_11_0;
默认jQuery:正在加载。。。
附加jQuery:正在加载。。。
Lorem ipsum dolor sit amet,是一位杰出的献身者。塞德·菲利斯·夸姆。前庭前庭下的特殊疾病。黄花叶、黄花叶、同侧斜角叶舌、直径和宽度。作为调味品的甜味剂,非口头禅。埃尼安·埃利芬德·帕特·尼布(Aenean eleifend Volatip nibh),欧盟临时拍卖人ac.Proin ultrices cursus scelerisque。库拉比图尔·塞姆·萨皮恩,时不我待,维韦拉·韦尔奥迪奥。这是一个很好的例子。苏打乳酪酒。多内克·托尔图纳,维韦拉·塞德·卢克图斯在,元素坐在阿梅特·图皮斯

//继续对原始jQuery版本使用“$” $(文档).ready(函数(){ $('#default jquery').text($().jquery); }); //对新添加的版本使用$.v1_11_0(…) $.v1_11_0(文档).ready(函数(){ $.v1_11_0(“#附加jquery”).text($.v1_11_0().jquery); });
第二种方法很好。然而,第一种方法会破坏你的网站。“jQuery更新”模块在d6上只获得1.3.*版本是有原因的。谢谢您的建议。我更新了答案以推荐更好的解决方案。另外,请使用
jQuery.noConflict(true)
,否则jQuery的两个版本将发生冲突:-)
jQuery.noConflict()
只删除
$
变量,传递
true
参数也会删除
jQuery
变量。没错,它会替换它,这基本上不是OP要求的。jQuery更新非常好,但前提是您没有一个有大量旧插件的大型站点,并且没有回归测试(sob)的空间。
<?php
function {theme_name}_preprocess(&$vars, $hook) {
if (arg(0) != 'admin' && $hook == "page") {
// Get an array of all JavaScripts that have been added
$javascript = drupal_add_js(NULL, NULL, 'header');

// Remove the original jQuery library
unset($javascript['core']['misc/jquery.js']);

// Add in our new jQuery library
// We do it this way to keep the includes in the same order
$core = array(
//Alternative jQuery
drupal_get_path('theme', '{theme_name}').'/js/libs/jquery-1.7.1.min.js' => array(
'cache' => TRUE,
'defer' => FALSE,
)
);

// Merge back into the array of core JavaScripts
$javascript['core'] = array_merge($javascript['core'], $core);

// Rerender the block of JavaScripts
$vars['scripts'] = drupal_get_js(NULL, $javascript);
}
}