web-dev-qa-db-ja.com

Drupal 7でのJQueryの使用

私は独自の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

32
JochenJung

Drupal 7アップグレードガイドから:

Javascriptは、既存のコードの周りに小さなラッパーを追加することにより、jQuery以外のライブラリと互換性を持たせる必要があります。

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

$ globalはjqueryオブジェクトを参照しなくなります。ただし、この構成では、ローカル変数$はjqueryを参照するため、コードは$を介してjQueryにアクセスできますが、コードは$ globalを使用する他のライブラリと競合しません。

コードで$変数の代わりに 'jQuery'変数を使用することもできます。

89
Eaton

Firebugによると、jQueryファイルはロードされています。

alt text

しかし、$は他の何かによって上書きされています:

alt text


あなたがすべきことは、最初の実引数としてjQueryオブジェクトを使用して自身を呼び出す関数で$変数の使用をカプセル化することです:

(function ($) {

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

}(jQuery));
14
Andreas Grech

スクリプトがこの方法で初期化されていない可能性があります。Drupal.behaviors.YOURTHEMENAMEを使用する必要があります

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

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

}

};
})(jQuery);    
8
Guus

Js用に個別のファイルを作成し、次を使用してjsファイルを追加できます。

drupal_add_js('path', 'module_name');
1
Yuri Kevin

「$は関数ではありません」は、jQueryの操作中に直面する可能性のある非常に一般的なエラーです。以下の回答を試すことができます。

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

OR

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

基本的に、これによりコードを実行し、JQueryの$ショートカットを使用できます。

0
Haripal Rao