Rails, javascript не загружается после нажатия ссылки link_to

У меня возникли проблемы с загрузкой моего javascript, когда я использую link_to helper в rails. Когда я либо вручную вводим url с "localhost: 3000/products/new", либо загружает страницу, загрузка javascript, но когда я просматриваю ссылку, как указано ниже, jQuery $(document).ready не будет загружаться на новую страницу.

Link_to, javascript не загружается, когда я нажимаю эту ссылку:

<%= link_to "New Product", new_product_path %>

product.js файл

$(document).ready(function() {
    alert("test");
});

Любая помощь будет высоко оценена. Спасибо заранее!

Ответ 1

Используете ли вы Rails 4? (Узнайте, выполнив rails -v в консоли)

Эта проблема, вероятно, связана с недавно добавленным драгоценным камнем Turbolinks. Это заставляет ваше приложение вести себя как одностраничное приложение JavaScript. Он имеет несколько преимуществ (быстрее), но, к сожалению, он разбивает некоторые существующие события, такие как $(document).ready(), потому что страница никогда не перезагружается. Это объясняет, почему JavaScript работает, когда вы напрямую загружаете URL-адрес, но не когда вы переходите к нему через link_to.

Здесь RailsCast о Turbolinks.

Есть несколько решений. Вы можете использовать jquery.turbolinks как исправление для удаления, или вы можете переключить оператор $(document).ready(), вместо этого используйте Turbolinks 'page:change' событие:

$(document).on('page:change', function() {
    // your stuff here
});

В качестве альтернативы вы можете сделать что-то подобное для совместимости с обычными загрузками страниц, а также с Turbolinks:

var ready = function() {
    // do stuff here.
};

$(document).ready(ready);
$(document).on('page:change', ready);

Если вы используете Ruby on Rails > 5 (вы можете проверить, запустив rails -v в консоли), используйте 'turbolinks:load' вместо 'page:change'

$(document).on('turbolinks:load', ready);

Ответ 2

У меня такая же проблема, но jquery.turbolinks не помогло. Я заметил, что мне нужно переопределить метод GET.

Есть мой пример:

<%= link_to 'Edit', edit_interpreter_path(@interpreter), method: :get %>

Ответ 3

Если вы используете рельсы 5 вместо 'page:change', вы должны использовать 'turbolinks:load' следующим образом:

$(document).on('turbolinks:load', function() {
  // Should be called at each visit
})

Источник: fooobar.com/questions/85347/...

Ответ 4

Вы также можете обернуть свою ссылку с помощью div, который указывает на отсутствие данных-turbolink.

Пример:

<div id="some-div" data-no-turbolink>
    <a href="/">Home (without Turbolinks)</a>
</div>

Источник: https://github.com/rails/turbolinks

Ответ 5

Убедитесь, что у вас нет встроенных тегов <script>. (Inline script теги плохие с turbolinks).

Ответ 6

FWIW, из Turbolinks docs, более подходящим событием для захвата вместо $(document).ready является page:change.

page:load имеет оговорку, что он не срабатывает при перезагрузке кеша...

В DOM загружен новый элемент body. Не запускается при частичной замене или когда страница восстанавливается из кеша, чтобы не запускать дважды в одном теле.

И поскольку Turbolinks просто переключает представление, более подходящим является page:change.