2011-01-13 17 views
32

私は独自のDrupal 7モジュールを作成しています.Juperyを使用するのが好きです。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

答えて

89

From the Drupal 7 upgrade guide:

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.

することもできますちょうどあなたのコードで$変数の代わりに 'jQuery'変数を使用してください。スクリプトがこのように初期化されていませんが、あなたはDrupal.behaviors.YOURTHEMENAME

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

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

} 

}; 
})(jQuery);  
+0

ありがとう!それはまさに私が探していたもので、見つけることができませんでした! – JochenJung

+3

私はJavascriptでこの構文に慣れていません。誰かがここで何が起こっているのか説明できますか? –

+2

基本的に$からjQueryへのエイリアスを作成します。上記のように、この理由は$を使用している他のJSライブラリを含めるためです。 – Berdir

14

のFirebugによると、お使いのjQueryファイルがロードされている:

alt text

をしかし$は何か他のもので上書きされている:

alt text


あなたは何をすべき

は、それが最初の実引数だとしてjQueryオブジェクトを使用して自分自身を呼び出す機能を$変数の使用をカプセル化です:

(function ($) { 

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

}(jQuery)); 
+0

なぜ$が定​​義されていないのですか?上書きされていますか? – JochenJung

+2

Prototypeなどの他のJavascriptライブラリとの競合を避けるためです。 – Tapirboy

8

チャンス作業中に直面する可能性が非常に一般的なエラーですjQueryであなたは、下記のいずれかの答えを試すことができます。

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

OR

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

基本的に、これは我々のコードはjQueryのための$のショートカットを実行し、使用できるようになります。

+0

この1つ私の問題を解決しました。私はd7を使用していました。ありがとうguus –

+2

'}(jQuery);')(jQuery); 'の代わりに'}(jQuery)); 'をコードの最後の行に使ってはいけませんか? – FLY

+0

あなたは完全な伝説です、これはそれです!誰もが聞いて、これはあなたがDrupalでそれを行う方法です!!!! – weaveoftheride

0

を使用する必要があります「$は関数ではありません」

関連する問題