0

基本的には、RailsのTurbolinksの追加のコンテキストで、described hereと同じ問題に直面しています。Turbolinks and Bootstrap Tab activation

私は*ではなくTurbolinksクリックからページをリロードした後、マニュアルページのリロード(F5)のための作業を行うコード

$(document).on('ready page:change', function() { 
    /* Show tab from anchor */ 
    var hash = window.location.hash; 
    hash && $('ul.nav a[href="' + hash + '"]').tab('show'); 

    /* Update URL anchor after selecting tab */ 
    $('.nav-tabs a').click(function (e) { 
     $(this).tab('show'); 
     var scrollmem = $('body').scrollTop(); 
     window.location.hash = this.hash; 
     $('html,body').scrollTop(scrollmem); 
    }); 

のこの部分を使用して、キャッシュのために復元しています。

* turbolinksリンクをクリックすると、ページのキャッシュがある場合は、そのキャッシュが最初に復元され、正常なタブが表示されますが、それでもサーバーに最後の内容を取得する要求がある場合、そして私のブートストラップコード

その要求が到着し、解析され、タブを元に、「スイッチバック」一度はこのようになります

<ul class="nav nav-tabs" role="tablist"> 
    <li class="nav-item"> 
    <a class="nav-link active" data-toggle="tab" href="#student" role="tab"></a> 
    </li> 
    <li class="nav-item"> 
    <a class="nav-link" data-toggle="tab" href="#mentor" role="tab"><%= </a> 
    </li> 
    <li class="nav-item"> 
    <a class="nav-link" data-toggle="tab" href="#company" role="tab"></a> 
    </li> 
</ul> 

<!-- Tab panes --> 
<div class="tab-content"> 
    <br /> 
    <div class="tab-pane fade in active" id="student" role="tabpanel"> 
     ... 
    </div> 
    <div class="tab-pane fade" id="mentor" role="tabpanel"> 
     ... 
    </div> 
    <div class="tab-pane fade" id="company" role="tabpanel"> 
     ... 
    </div> 
</div> 

答えて

1

Railsの5溶液がちょうど変更したことTurbolinks 5が付属していますイベントリスナーの名前

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