Javascript 在 Drupal 7 中使用 JQuery

声明:本页面是StackOverFlow热门问题的中英对照翻译,遵循CC BY-SA 4.0协议,如果您需要使用它,必须同样遵循CC BY-SA许可,注明原文地址和作者信息,同时你必须将它归于原作者(不是我):StackOverFlow 原文地址: http://stackoverflow.com/questions/4681309/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me): StackOverFlow

提示:将鼠标放在中文语句上可以显示对应的英文。显示中英文
时间:2020-08-23 13:36:27  来源:igfitidea点击:

Using JQuery in Drupal 7

javascriptjquerydrupaldrupal-7

提问by JochenJung

I'm writing my own Drupal 7 module, and like to use JQuery in it.

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

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

But I'm getting this error:

但我收到此错误:

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

It seems that JQuery is not loaded. Otherwise $ should be defined.

似乎未加载 JQuery。否则 $ 应该被定义。

Though I actually include it in the header:

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

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

Do I have to do anything else to activate JQuery in Drupal? Is $ being overwritten by Drupal?

我还需要做任何其他事情才能在 Drupal 中激活 JQuery 吗?$ 是否被 Drupal 覆盖?

That's the website: http://rockfinder.orgapage.de

这是网站:http: //rockfinder.orgapage.de

回答by Eaton

From the Drupal 7 upgrade guide:

来自 Drupal 7 升级指南:

Javascript should be made compatible with other libraries than jQuery by adding a small wrapper around your existing code:

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

The $ global will no longer refer to the jquery object. However, with this construction, the local variable $ will refer to jquery, allowing your code to access jQuery through $ anyway, while the code will not conflict with other libraries that use the $ global.

通过在现有代码周围添加一个小包装器,Javascript 应该与 jQuery 之外的其他库兼容:

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

$ global 将不再引用 jquery 对象。但是,通过这种构造,局部变量 $ 将引用 jquery,从而使您的代码无论如何都可以通过 $ 访问 jQuery,同时代码不会与其他使用 $ 全局变量的库发生冲突。

You can also just use the 'jQuery' variable instead of the $ variable in your code.

您也可以在代码中仅使用 'jQuery' 变量而不是 $ 变量。

回答by Andreas Grech

According to Firebug, your jQuery file is being loaded:

根据 Firebug,您的 jQuery 文件正在加载:

alt text

替代文字

But the $is being overwritten by something else:

但是$正在被其他东西覆盖:

alt text

替代文字



What you should do is encapsulate the use of the $variable with a function that invokes itself using the jQueryobject as it's first actual argument:

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

(function ($) {

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

}(jQuery));

回答by Guus

Chances are your script is not initialized this way, you'll have to use Drupal.behaviors.YOURTHEMENAME

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

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

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

}

};
})(jQuery);    

回答by Haripal Rao

"$ is not a function" is a very common error that you may face while working with jQuery. You can try any answers of given below:

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

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

OR

或者

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

Basically this will allow our code to run and use the $ shortcut for JQuery.

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

回答by Yuri Kevin

You can create the separate file for js and than add js file using the following:

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

drupal_add_js('path', 'module_name');