Jak zdobyć jquery działające na Drupal 7 - dla początkujących

8

Czytałem wiele samouczków online na temat tego, jak uzyskać jquery działające na Drupal 7. Chociaż istnieje wiele linii kodu i przykładów, nie mogę znaleźć tego, który kawałek kodu umieścić (gdzie może być oczywiste dla większości programistów)

Więc to, co robię, jest

1) Tworzę nowy niestandardowy blok

2) Tam z interfejsu drupal piszę mój kod

(function ($) {

  $(document).ready(function(){

    // jquery here

  });
})(jQuery);

3) Wyświetlam blok, ale jquery nie jest ładowane.

Czytam, że powinienem umieszczać ten kod w plikach szablonów, plikach motywów, plikach css, plikach informacyjnych i nie wiem whatelse!

Nie jest dla mnie jasne, w którym pliku i na której ścieżce muszę poprawnie ustawić powyższy kod?

Jakakolwiek rada?

Wielkie dzięki!

apdr
źródło

Odpowiedzi:

11

Kilka rzeczy tutaj:

  1. Jeśli możesz uniknąć wprowadzania javascript i PHP na stronę za pomocą interfejsu użytkownika, prawdopodobnie zaoszczędzisz kłopotów. Jeśli nie masz żadnych alternatyw, jest ok, ale oto kilka powodów, dla których nie jest to świetny pomysł: https://drupal.stackexchange.com/a/2512/10729 (zauważ, że jest to skierowane do PHP, nie js, ale większość punkty nadal oznaczają js). Przykłady modułu ma przykład tworzenia własnych bloków.
  2. Aby dołączyć js, jeśli chcesz na wszystkich stronach, możesz dodać go do pliku informacyjnego motywu. Jeśli chcesz go jednak tylko w niektórych miejscach, najlepiej użyj drupal_add_js (), aby był tylko na stronach, na których musi być. Aby dołączyć zachowanie js do formularzy, możesz również użyć atrybutu #attached dla elementów formularza.
  3. Jeśli użyjesz $ (document) .ready (), to uruchomi javascript po załadowaniu strony, jednak jeśli strona zostanie zaktualizowana przez ajax, twój javascript nie uruchomi się ponownie, więc na nowy znacznik nie będzie miał wpływu żaden skrypt javascript jest. Aby poradzić sobie z tymi przypadkami, powinieneś używać zachowań drupala zamiast przygotowywania dokumentu.

Na przykład:

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

Polecam przeczytanie tych stron:
Zarządzanie JavaScript w Drupal 7
Praca z JavaScript i jQuery

dureń
źródło
7

W swoim .js wstaw taki kod;

(function ($) {  

  Drupal.behaviors.themename = {

    attach: function (context, settings) {            

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

   }

 };})(jQuery);

W szablonie theme.php utwórz hook_preprocess_html, a następnie za pomocą drupal_add_js

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

Po prostu zmień ich nazwę

Sibiru
źródło
1
Pamiętaj, że spowoduje to dodanie javascript do każdej strony, co może, ale nie musi być pożądane.
rooby
1
Hehe tak, to doda javascript do każdej strony. Niech @apdr spróbuje tego i przetestuje swoją wiedzą
sibiru
2
jeśli chcesz, aby plik js był ładowany na każdej stronie za pośrednictwem motywu, nie ma większego sensu po prostu umieszczenie pliku w pliku .info kompozycji?
Jimajamma
3

Twój plik .js powinien wyglądać następująco:

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

        //your code

        }
    }
}(jQuery));

użyj drupal_add_js () w swoim module, aby dodać ten plik w Drupal. dobre referencje tu i tutaj .

często czyść pamięć podręczną;)

proszę zrestartować komputer
źródło