實現CSS和Ruby on Rails中的選項卡

我是Ruby on Rails的新手，我很難設置選項卡。顯示的標籤，但我有一個問題，當頁面刷新。實現CSS和Ruby on Rails中的選項卡

每次頁面刷新時，標籤都不會保留在當前活動標籤上，而會恢復到第一個標籤。此外，標籤ID不會顯示在URL中。

我正在使用Ruby on Rails和Materialise CSS。

謝謝！

HTML

<div class="col s12"> 
    <ul class="tabs" id="tabs"> 
    <li class="tab col s3"><a href="#tabs-1">Learning</a></li> 
    <li class="tab col s3"><a href="#tabs-2">Setting Up</a></li> 
    <li class="tab col s3"><a href="#tabs-3">Milestones</a></li> 
    <li class="tab col s3"><a href="#tabs-4">Personal Survey</a></li> 
    </ul> 
</div> 

<div id="tabs-1" class="col s12"> 
    <h5>Tab Content</h5> 
</div> 

<div id="tabs-2" class="col s12"> 
    <h5>Tab Content</h5> 
</div> 

<div id="tabs-3" class="col s12"> 
    <h5>Tab Content</h5> 
</div> 

<div id="tabs-4" class="col s12"> 
    <h5>Tab Content</h5> 
</div>

的js

<script> 
    $(document).ready(function(){ 
    $('ul.tabs').tabs('select_tab', 'tab_id'); 
    }); 
</script>

UPDATE

我試圖存儲主動標籤ID在本地存儲，但我不知道如果我做得正確。 Chrome顯示我的本地存儲中沒有商店。

Im on Rails using Materialize CSS with JQuery Plugin. 

    $("#tabs").tabs({ 
     active: localStorage.getItem("currentIdx"), 
     activate: function(event, ui) { 
      localStorage.setItem("currentIdx", $(this).tabs('option', 'active')); 
     } 
    });

來源

2016-06-08 Patrick Long

，如果你不想失去選擇的選項卡信息時重新加載頁面，則需要使用Cookie /會話存儲保存最後一個活動標籤和有源再次頁面重新加載時，使保存的標籤。

來源

2016-06-08 03:08:32 Don

實現CSS和Ruby on Rails中的選項卡

回答

相關問題