Wie man jquery dazu bringt, an Drupal 7 zu arbeiten - für Neulinge

Ich habe viele Online-Tutorials gelesen, wie man jquery auf Drupal 7 zum Laufen bringt. Obwohl es viele Codezeilen und Beispiele gibt, kann ich nicht finden, welcher Code wo abgelegt werden soll (vielleicht ist es für die meisten Entwickler offensichtlich).

Also, was ich tue ist

1) Ich erstelle einen neuen benutzerdefinierten Block

2) Dort drüben von der Drupal-Benutzeroberfläche schreibe ich meinen Code

(function ($) {

  $(document).ready(function(){

    // jquery here

  });
})(jQuery);

3) Ich zeige den Block an, aber die Abfrage wird nicht geladen.

Ich lese, dass ich diesen Code in Vorlagendateien, Themendateien, CSS-Dateien, Info-Dateien einfügen sollte, und ich weiß nicht, was sonst!

Es ist mir nicht klar, in welcher Datei genau und in welchem ​​Pfad ich den obigen Code einfügen muss, um richtig zu funktionieren?

Irgendein Rat?

Danke vielmals!

Ein paar Dinge hier:

1. Wenn Sie vermeiden können, Javascript und PHP über die Benutzeroberfläche in die Site einzugeben, ersparen Sie sich möglicherweise Probleme auf der ganzen Linie. Wenn Sie keine Alternativen haben, ist es in Ordnung, aber hier sind einige Gründe, warum es keine gute Idee ist: /drupal//a/2512/10729 (beachten Sie, dass dies auf PHP abzielt, nicht auf js, sondern auf die meisten die Punkte stehen immer noch für js). Das Beispielmodul enthält ein Beispiel zum Erstellen benutzerdefinierter Blöcke.
2. Wenn Sie js auf allen Seiten anhängen möchten, können Sie es der Info-Datei Ihres Themas hinzufügen. Wenn Sie es jedoch nur an einigen Stellen möchten, verwenden Sie am besten drupal_add_js (), damit es nur auf Seiten angezeigt wird. Zum Anhängen des js-Verhaltens an Formulare können Sie auch das Attribut #attached für Ihre Formularelemente verwenden.
3. Wenn Sie $ (document) .ready () verwenden, wird Ihr Javascript beim Laden der Seite ausgelöst. Wenn die Seite jedoch über Ajax aktualisiert wird, wird Ihr Javascript nicht erneut ausgelöst, sodass das neue Markup nicht von Ihrem Javascript beeinflusst wird ist. Um diese Fälle zu behandeln, sollten Sie Drupal- Verhalten anstelle von Dokument bereit verwenden.

Zum Beispiel:

(function ($) {
  Drupal.behaviors.yourBehaviorName = {
    attach: function (context, settings) {
      // Do your thing here.
    }
  };
})(jQuery);

Ich empfehle, diese Seiten zu lesen:
Verwalten von JavaScript in Drupal 7
Arbeiten mit JavaScript und jQuery

Fügen Sie in Ihre .js den folgenden Code ein.

(function ($) {  

  Drupal.behaviors.themename = {

    attach: function (context, settings) {            

     // All our js code here
     alert('Hello jQuery');
     // end our js code

   }

 };})(jQuery);

Erstellen Sie in Ihrer Theme template.php hook_preprocess_html und verwenden Sie dann drupal_add_js

function themename_preprocess_html(&$variables) {
  drupal_add_js(drupal_get_path('theme', 'themename') . '/js/your.js', array( 
    'scope' => 'footer', 
    'weight' => '15' 
  ));
}

Ändern Sie einfach den Namen

Ihre .js-Datei sollte folgendermaßen aussehen:

(function ($) {
    Drupal.behaviors.cdgi = {
        attach: function(context) {

        //your code

        }
    }
}(jQuery));

Verwenden Sie drupal_add_js () in Ihrem Modul, um diese Datei in Drupal hinzuzufügen. gute Referenzen hier und hier .

Cache oft leeren;)