Ruby on Rails: отображать javascript только на определенной странице с включенными турбоссылками

У меня есть javascript, встроенный в представление в Rails, которое использует Turbolinks, например:

ViewX.html.haml:

.blah
  Blah

:javascript
 $(function() {
   $(".blah").offset().top;
 });

Все работает нормально, когда я загружаю ViewX. Но затем, когда я перехожу к View Y, я получаю следующую ошибку в консоли:

Uncaught TypeError: Cannot read property 'top' of undefined

И эта ошибка сохраняется, когда я перехожу к другим представлениям. Он исчезает при жестком обновлении, но возвращается в следующий раз, когда я визуализирую ViewX.

Мой вопрос: как мне сделать так, чтобы некоторые фрагменты JS отображались только для определенного представления и не загрязняли остальную часть приложения?

ИЗМЕНИТЬ

Хорошо, я нашел способ, который является своего рода хаком, но закрытым хаком. Измените ViewX.html.haml на:

ViewX.html.haml:

.blah
  Blah

%script{:type => "text/javascript", 'data-turbolinks-eval' => 'false'}
 :plain
   $(function() {
     $(".blah").offset().top;
   });

person melder    schedule 20.09.2013    source источник


Ответы (1)


Простой способ — сделать так, чтобы каждое представление имело свой класс css в теге body:

var bodyClass = $('body').attr('class');

switch(bodyClass) {
    case 'home-page':
    // do stuff
    break;

    case 'about-page':
    // do stuff
    break;
}

Если на каждой странице много кода, вы можете использовать шаблон модуля и сделать каждый модуль отдельным файлом .js.

case 'home-page'
  MyModule.initialize(); // set up form validation or whatever you need
break;

Другой вариант (если вы не можете добавить класс CSS в тег body) — использовать скрытый тег <input>, который содержит имя представления и использовать его для переключения.

var switchJS = $('input[type=hidden]').attr('data-view');
/* i.e. <input type="hidden" data-view="my-home-page" /> */
switch(switchJS) { ...
person redconservatory    schedule 20.09.2013
comment
Это хаки. Да, я могу просто сделать это или просто обернуть код: if ($(.blah).length == 0), но учет станет более серьезной проблемой при добавлении большего количества JS в будущем. - person melder; 20.09.2013
comment
Я думаю, что для более масштабного проекта это будет примерно так: stackoverflow.com/questions/6167805/ - person redconservatory; 20.09.2013
comment
Начнем с того, что JS не находится в конвейере ресурсов... Он встроен в файл HAML и загружается при отображении представления. Впоследствии это сохраняется из-за турболинков. То есть, когда турбоссылки отключены, переход на другую страницу не вызовет ошибку консоли. - person melder; 20.09.2013