, ,

[Ruby on Rails 4] Turbolinks 5 で JavaScript が発火しない問題の対処

公開日: 2017/01/26
更新日: 2018/10/06

Turbolinks の仕組みを理解できていないけれども、ひとまず動かす方法。

Contents

Head

Head に reload を設定。

application.html.haml
    = stylesheet_link_tag    'application', media: 'all', 'data-turbolinks-track': 'reload'
    = javascript_include_tag 'application', 'data-turbolinks-track': 'reload'

JavaScript

jQuery で $(document).ready な呼び出しをしたい場合は、こんな形式で。

application.js
$(document).on('turbolinks:load', function() {
  console.log("It works on each visit!");
});

JavaScript であれば、turbolinks:load イベントに対してイベントリスナーを追加するので、こんな形式で。

application.js
document.addEventListener('turbolinks:load', function() {
  console.log("It works on each visit!");
});

ページ遷移のたびに、console.log されることが確認できる。

情報

Turbolinks が分からない。

off にする方法。

補遺