在页面上包含两个版本的jQuery，而不影响旧的插件 [英] Include two versions of jQuery on a page without affecting old plugins

问题描述

这个问题是这样的：

$ b $我们的drupal网站运行着jQuery版本1.2.1，我们还没有升级b

我们需要添加一个名为jQuery Tokeninput的插件，但它只适用于最新的jQuery版本。我们尝试添加最新的jQuery版本与旧版本，但它会产生奇怪的结果。

我的问题是，如何包含最新的jQuery文件，而不影响旧的jQuery插件？

解决方案

方法＃1：（推荐）

你可以这样做：

 < script type ='text / javascript'src ='js / jquery_1.7.1.js'>< /脚本> 
< script type ='text / javascript'> 
 //如果你想知道为什么我们传递true参数，
 //这里是解释：
 //  - 当你使用jQuery.noConflict（）时，它会删除
 //$全局变量。 
 //  - 当您使用jQuery.noConflict（true）时，它还
 //删除jQuery全局变量。 
 var $ jq = jQuery.noConflict（true）; 
< / script> 
< script type ='text / javascript'src ='js / jquery_1.2.1.js'>< / script> 
  

这样当你想要使用新版本的jquery而不是 $ 使用 $ jq 。

  $ jq（'。selector'）。on（'click'，function（）{
 // do something 
}）; 
  

方法＃2 :(可能会破坏您网站上的东西 - 不推荐）

在您的 template.php 文件中：

 <？php 
 function {theme_name} _preprocess（& $ vars，$ hook）{
 if（arg（0）！='admin'& & $ hook ==page）{
 //获取已添加的所有JavaScript的数组
 $ javascript = drupal_add_js（NULL，NULL，'header'）; 
 
 //删除原始的jQuery库
 unset（$ javascript ['core'] ['misc / jquery.js']）; 
 
 //添加我们的新jQuery库
 //我们这样做，以保持包含在同一顺序
 $ core = array（
 //替代jQuery 
 drupal_get_path（'theme'，'{theme_name}'）。'/ js / libs / jquery-1.7.1.min.js'=>数组（
'cache'=> TRUE，
'defer'=> FALSE，
）
）; 
 
 //合并回核心JavaScript数组
 $ javascript ['core'] = array_merge（$ javascript ['core']，$ core）; 
 
 // Rerender的JavaScript块
 $ vars ['scripts'] = drupal_get_js（NULL，$ javascript）; 
} 
} 
  

请务必只在你的网站的前端。如果他们依赖于Drupal的jQuery版本，它可能会弄乱管理工具栏。

Our drupal site runs with jQuery version 1.2.1 which we have not upgraded.

The problem is this:

We need to add a new plugin named jQuery Tokeninput, but it's working only in latest jQuery versions. We tried adding the latest jQuery version with old version, but it produces weird results.

My question is, how to include the latest jQuery file without affecting the old jQuery plugins?

解决方案

Method #1: (recommended)

You could do something like this:

<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> 

And this way when you want something made with the new version of jquery instead of the $ use $jq.

$jq('.selector').on('click', function(){  
    //do something  
});

Method #2: (might break things on your site - not recommended)

In your template.php file:

<?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);
}
}

Be sure to only do this on the frontend of your site. It can mess up admin toolbars if they are dependent on Drupal's version of jQuery.

这篇关于在页面上包含两个版本的jQuery，而不影响旧的插件的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！