Drupal 7覆盖自定义主题中的jquery js文件

时间:2014-04-06 21:32:38

标签: javascript php jquery drupal drupal-7

是否可以重写/覆盖自定义模板脚本变量中使用的默认Drupal 7.26 jquery?

我指的是其中一个js文件:

<script type="text/javascript" src="http://drupal.dev/misc/jquery.js?v=1.4.4"></script>

来自自定义主题的那个?

我在sites/all/MYTPL/template.php中尝试了此操作,但它不起作用:

$scripts['misc/jquery.js']['data'] = $base_theme . '/js/packages/jquery-2.1.0.min.js';

我想知道是否有人在不使用jQuery Update等任何模块的情况下管理它?

===更新===

实际上,我根据@cojomojo的答案,通过一些修改,通过接受的答案帮助解决了这个问题:

function THEMEname_js_alter(&$javascript) {
    // Swap out jQuery to use an updated version of the library.
    $javascript['misc/jquery.js']['data'] = drupal_get_path('theme', 'THEMEname') . '/js/packages/jquery-2.1.0.min.js';
}

3 个答案:

答案 0 :(得分:8)

在主题的template.php文件中使用此代码,位于hook_js_alter

function [YOUR_THEME]_js_alter(&$js)
{
    $jqKey = "my-new-jquery"; // a key for new jquery file entry
    $js[$jqKey] = $js['misc/jquery.js']; // copy the default jquery settings, so you don't have to re-type them.
    $js[$jqKey]['data'] = "https://code.jquery.com/jquery-2.1.0.min.js"; // the path for new jquery file.
    $js[$jqKey]['version'] = '2.1.0'; // your jquery version.

    unset($js['misc/jquery.js']); // delete drupal's default jquery file.
}

答案 1 :(得分:4)

所以你有几个选择来做这件事。他们在这里:

您可以像这样使用hook_js_alter:

<?php
function hook_js_alter(&$javascript) {
  // Swap out jQuery to use an updated version of the library.
 $javascript['misc/jquery.js']['data'] =         drupal_get_path('module', 'jquery_update') . '/jquery.js';
}
?>

或者为了避免像2pha所提到的破坏,你可以并排运行两个版本的jquery。 jQuery已经具有与不同版本的jQuery一起运行的功能(或者,实际上,与使用$符号作为函数或变量的任何其他JavaScript库一起运行)。这是noConflict()函数。您可以在此处查看API页面:http://api.jquery.com/jQuery.noConflict/

要在项目中使用此功能,只需告诉浏览器您的新jQuery库,并通过自定义noConflict标识符引用它。以下是如何在自定义主题中实现此功能的示例。

<强>的MyTheme / page.tpl.php中

<head>
  <title><?php print $head_title; ?></title>
  <?php print $head; ?>
  <?php print $styles; ?>
  <script type="text/javascript" src="//ajax.googleapis.com/ajax/libs/jquery/1.4.4/jquery.min.js"></script>
  <script type="text/javascript">
    var $jq = jQuery.noConflict();
  </script>
  <?php print $scripts; ?>
</head>

另一种可能的方法是将jQuery与预处理页面交换,如下所示:

<?php
function yourModuleOrThemeName_preprocess_page(&$variables) {
  // exclude backend pages to avoid core js not working anymore
  // you could also just use a backend theme to avoid this
  if (arg(0) != 'admin' || !(arg(1) == 'add' && arg(2) == 'edit') || arg(0) != 'panels' || arg(0) != 'ctools') {
    $scripts = drupal_add_js();
    $new_jquery = array(drupal_get_path('theme', 'YOURTHEME') . '/js/jquery-1.7.1.min.js' => $scripts['core']['misc/jquery.js']);
    $scripts['core'] = array_merge($new_jquery, $scripts['core']);
    unset($scripts['core']['misc/jquery.js']);
    $variables['scripts'] = drupal_get_js('header', $scripts);
  }
}
?>

对我而言,最好的方法是并行运行两个版本的jQuery(Drupal 7默认使用的版本以及您的主题需要的任何版本)或者使用预处理页面交换jQuery。 hook_js_alter有可能破坏需要不同版本的jQuery的任何东西。所有可能的方式来做你所要求的是:https://drupal.org/node/1058168

答案 2 :(得分:2)

也许使用勾hook_js_alter 请记住,虽然其他模块将依赖于jQuery,如果它们使用的版本之间发生了变化,您可能会遇到问题。