Как заставить JQuery работать на Drupal 7 - для новичков

8

Я читал много онлайн-уроков о том, как заставить jquery работать на drupal 7. Несмотря на то, что есть много строк кода и примеров, я не могу найти, какой фрагмент кода поместить (где это может быть очевидно для большинства разработчиков).

Итак, что я делаю,

1) Я создаю новый пользовательский блок

2) Там из друпал UI, я пишу свой код

(function ($) {

  $(document).ready(function(){

    // jquery here

  });
})(jQuery);

3) Я отображаю блок, но jquery не загружается.

Я читаю, что я должен поместить этот код в файлы шаблонов, файлы тем, файлы CSS, информационные файлы, и я не знаю, что!

Мне не ясно, в какой именно файл и в какой путь я должен поместить приведенный выше код для правильной работы?

Любой совет?

Большое спасибо!

APDR
источник

Ответы:

11

Пара вещей здесь:

  1. Если вы можете избежать ввода javascript и PHP на сайт через пользовательский интерфейс, это, возможно, избавит вас от проблем в будущем. Если у вас нет альтернатив, это нормально, но вот несколько причин, почему это не очень хорошая идея: https://drupal.stackexchange.com/a/2512/10729 (обратите внимание, что это нацелено на PHP, не на js, а на большинство точки по-прежнему стоят за JS). В модуле examples есть пример создания пользовательских блоков.
  2. Для прикрепления js, если вы хотите его на всех страницах, вы можете добавить его в информационный файл вашей темы. Если вы хотите использовать его только в некоторых местах, лучше всего использовать drupal_add_js (), поэтому это нужно делать только на страницах. Для прикрепления поведения js к формам вы также можете использовать атрибут #attached на элементах формы.
  3. Если вы используете $ (document) .ready (), он будет запускать ваш javascript при загрузке страницы, однако, если страница обновляется через ajax, ваш javascript не будет запускаться снова, поэтому новая разметка не будет зависеть от вашего javascript является. Для обработки этих случаев вы должны использовать Друпало поведение вместо документа готов.

Например:

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

Я рекомендую прочитать эти страницы:
Управление JavaScript в Drupal 7
Работа с JavaScript и jQuery

rooby
источник
7

В вашем .js вставьте как этот код;

(function ($) {  

  Drupal.behaviors.themename = {

    attach: function (context, settings) {            

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

   }

 };})(jQuery);

В вашей теме template.php создайте hook_preprocess_html, затем используя drupal_add_js

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

Просто измените название

sibiru
источник
1
Обратите внимание, что это добавит JavaScript на каждую страницу, что может быть или не быть желательным.
Роби
1
Хе-хе, да, это добавит JavaScript на каждую страницу. Просто дайте @apdr попробовать это и протестируйте с его знаниями
sibiru
2
если вы хотите, чтобы js загружался на каждую страницу через тему, не имеет ли больше смысла просто перечислять файл в .info файле темы?
Jimajamma
3

Ваш файл .js должен выглядеть так:

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

        //your code

        }
    }
}(jQuery));

используйте drupal_add_js () в вашем модуле, чтобы добавить этот файл в Drupal. хорошие ссылки здесь и здесь .

очищать кеш часто;)

пожалуйста перезагрузите
источник