在 Drupal 7 中使用 JQuery

Posted 2023-02-15

【中文标题】在 Drupal 7 中使用 JQuery

【英文标题】：Using JQuery in Drupal 7

【发布时间】：2011-06-08 13:18:04

【问题描述】：

我正在编写自己的 Drupal 7 模块，并且喜欢在其中使用 JQuery。

$('#field').toggle();

但是我收到了这个错误：

TypeError: Property '$' of object [object DOMWindow] is not a function

似乎没有加载 JQuery。否则应该定义 $。

虽然我实际上将它包含在标题中：

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

在 Drupal 中激活 JQuery 是否需要做其他事情？ $ 是否被 Drupal 覆盖？

那是网站：http://rockfinder.orgapage.de

【参考方案1】：

您可以为 js 创建单独的文件，然后使用以下命令添加 js 文件：

drupal_add_js('path', 'module_name');

【参考方案2】：

“$ 不是函数”是您在使用 jQuery 时可能遇到的一个非常常见的错误。您可以尝试以下给出的任何答案：

(function($)
//your can write your code here with $ prefix
)(jQuery);

或

jQuery(document).ready(function($)
//Write your code here
);

基本上这将允许我们的代码运行并使用 JQuery 的 $ 快捷方式。

【参考方案3】：

您的脚本可能没有以这种方式初始化，您必须使用 Drupal.behaviors.YOURTHEMENAME

(function ($) 
Drupal.behaviors.YOURTHEMENAME = 
attach: function(context, settings) 

/*Add your js code here*/
alert('Code');



;
)(jQuery);    

【讨论】：

您不应该在代码的最后一行使用(jQuery)); 而不是)(jQuery); 吗？

你绝对的传奇，就是这样！大家听着，这就是你在 Drupal 中的做法！！！！

【参考方案4】：

根据 Firebug，您的 jQuery 文件正在加载：

但是$ 被其他东西覆盖了：

---

您应该做的是将$ 变量的使用封装在一个函数中，该函数使用jQuery 对象作为它的第一个实际参数来调用自身：

(function ($) 

 // in this function, you can use the $ which refers to the jQuery object

(jQuery));

【讨论】：

那么.. 为什么 $ 没有定义？是否被覆盖？

是为了避免与Prototype等其他Javascript库发生冲突。

【参考方案5】：

From the Drupal 7 upgrade guide:

应该使Javascript兼容 与 jQuery 以外的其他库 在你的周围添加一个小包装 现有代码：

(function ($) 
  // Original JavaScript code.
)(jQuery);

$ 全局将不再指代 jquery 对象。然而，有了这个 构造，局部变量 $ 将引用 jquery，允许您的 通过 $ 访问 jQuery 的代码 无论如何，虽然代码不会 与使用的其他库冲突 $全局。

您也可以在代码中只使用“jQuery”变量而不是 $ 变量。

【讨论】：

谢谢！这正是我一直在寻找但找不到的东西！

我不熟悉 Javascript 中的这种语法。有人能解释一下这里发生了什么吗？

它基本上创建了一个从 $ 到 jQuery 的别名。如上所述，这样做的原因是包含其他使用 $ 的 JS 库。

由于某种原因，这给了我一个很长的错误消息，但是当我用 jQuery 替换 $ 时它工作得很好。

@Jim 代码被包装到一个带有参数 $ 的函数中。然后用 jQuery 调用它，它通过将 $ 的所有实例替换为 jQuery 来执行该函数。这是解决“$ 不是函数”问题的三种方法之一（请参阅tshikatshikaaa.blogspot.com/2012/05/…）