Bootstrap-更改導航欄中的活動類

Question

我知道這個問題被問了百萬次以上，但是我還沒有填補一個空白。

我有一個非常基本的導航欄結構，如下所示：

<ul class="nav navbar-nav navbar-right">
        <li class="nav-item">
            <%= link_to "Entry", entry_path, class: 'nav-link', 'data-turbolinks' => false %>
        </li>
        <li class="nav-item">
            <%= link_to "Entry 2", entry2_path, class: 'nav-link', 'data-turbolinks' => false %>
        </li>
        <li class="nav-item localization-links">
            <% unless I18n.locale == :en %>
                <div class="unactive-localization-button">
                    <%= link_to "EN", locale: :en %>
                </div>
            <% else %>
                <a class: 'nav-link'>EN</a> 
            <% end %>
        </li>
        <li class="nav-item localization-links">
            <% unless I18n.locale == :fr %>
                <%= link_to "FR", locale: :fr %>
            <% else %>
                <a class: 'nav-link'>FR</a>
            <% end %>
        </li>
    </ul>

我的實際結構更加復雜，因此我像其他鏈接和條件一樣減少了大部分代碼，以提高可讀性。 我這樣更改活動班級：

$(".nav li").click(function() {
    if ($(".nav li").hasClass("active")) {
       $(this).removeClass("active");
    } else {
       $(this).addClass("active");
    }
});

它適用於除本地化鏈接以外的所有鏈接（“條目1”，“條目2”等）。 我想要的只是給這些鏈接一個活動的類，但是到目前為止，我仍然無法以某種方式對我有用（我使用該線程檢查我哪里出錯了）。 更改本地化時，我沒有控制台錯誤，顯然我在瀏覽器的編輯器中手動添加了“活動”類，但沒有添加代碼。 有什么想法嗎？ 在此先感謝您的寶貴時間，我們非常感謝您的任何評論或回答！

Answer 1

我解決了這個問題。 這不是一個普遍的問題（至少我在谷歌搜索時沒有找到它），但是無論如何我也會發布我的解決方案，以防有人也遇到這種問題。 unless聲明， unless我的問題不正確，這就是我的工作方式：

<% unless I18n.locale == :en %>
    <li class="nav-item">
        <%= link_to "EN", locale: :en %>
    </li>
<% else %>
    <li class="nav-item active">
        <a class='nav-link'>EN</a> 
    </li>
<% end %>
<% unless I18n.locale == :fr %>
    <li class="nav-item">
        <%= link_to "FR", locale: :fr %>
    </li>
 <% else %>
     <li class="nav-item active">
         <a class='nav-link'>FR</a>
     </li>
 <% end %>

因此，如果用戶選擇語言環境，我將顯式傳遞active類。