web-dev-qa-db-fra.com

Utiliser JQuery dans Drupal 7

J'écris mon propre module Drupal 7 et j'aime y utiliser JQuery.

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

Mais je reçois cette erreur:

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

Il semble que JQuery n'est pas chargé. Sinon, $ devrait être défini.

Bien que je l'inclue réellement dans l'en-tête:

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

Dois-je faire autre chose pour activer JQuery dans Drupal? Est-ce que $ est écrasé par Drupal?

C'est le site: http://rockfinder.orgapage.de

javascriptjquerydrupaldrupal-7
32
JochenJung

À partir du guide de mise à niveau de Drupal 7:

Javascript devrait être rendu compatible avec d'autres bibliothèques que jQuery par en ajoutant une petite enveloppe autour de votre code existant:

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

Le $ global ne fera plus référence à l'objet jQuery. Cependant, avec cela construction, la variable locale $ fera référence à jquery, permettant à votre code pour accéder à jQuery via $ de toute façon, alors que le code ne sera pas conflit avec d'autres bibliothèques qui utilisent le $ global.

Vous pouvez également simplement utiliser la variable 'jQuery' à la place de la variable $ dans votre code.

89
Eaton

Selon Firebug, votre fichier jQuery est en cours de chargement:

alt text

Mais le $ est écrasé par autre chose:

alt text

Ce que vous devez faire est d'encapsuler l'utilisation de la variable $ avec une fonction qui s'appelle elle-même en utilisant l'objet jQuery comme premier argument réel:

(function ($) {

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

}(jQuery));
14
Andreas Grech

Les chances sont que votre script n'est pas initialisé de cette façon, vous devrez utiliser Drupal.behaviors.YOURTHEMENAME

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

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

}

};
})(jQuery);
8
Guus

"$ is not a function" est une erreur très courante que vous pouvez rencontrer lorsque vous travaillez avec jQuery. Vous pouvez essayer toutes les réponses ci-dessous:

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

OR

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

En gros, cela permettra à notre code de s'exécuter et d'utiliser le raccourci $ pour JQuery.

0
Haripal Rao