Question

父页面很好：

当我点击子页面时，它的行为与父程序不同：

虽然我在子页面中有 base.html 但它不会显示为希望。

我尝试了几种没有运气的解决方案，所以希望你能以正确的方式引导我。

仍然是新手，感谢所有人的帮助，伙计们！

编辑：添加了更多HTML

base.html文件

<html>
<body>

<script>
$(document).ready(function() {
   $('li.active').removeClass('active');
   $('a[href="' + location.pathname + '"]').closest('li').addClass('active');
});
</script>

   <header>
    <nav class="navbar navbar-default navbar-fixed-top" role="navigation">
      <div class="container">
        <div class="navbar-header">
          <button type="button" class="navbar-toggle" data-toggle="collapse" data-target="#menu">
            <span class="sr-only">Toggle navigation</span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
            <span class="icon-bar"></span>
          </button>
          <a class="navbar-brand" href="{% url 'dashboard' %}">Prociation</a>

              <a class="navbar-brand" href="#" id="notifications" data-container="body" data-toggle="popover" data-placement="bottom" title="Notifications">
                <span class="glyphicon glyphicon-home"></span>
              </a>

        </div>
        <div class="collapse navbar-collapse" id="menu">
        <ul class="nav navbar-nav">
            <li  class="active"><a href="{% url 'member_overview' %}">
                 {% trans 'Members' %}</a></li>
            <li><a href="{% url 'docs' %}">
                {% trans 'Documents' %}</a></li>
            <li><a href="{% url 'articles' %}">
               {% trans 'Articles' %}</a></li>
            <li><a href="{% url 'pics' %}">
                {% trans 'Pictures' %}</a></li>
       </ul>
      </div>
    </div>
  </header>
 </body>
</html>

member_overview.html

{% extends 'base.html' %}
 ...
 <div class="row">
    <a class="btn btn-primary btn-lg" href="{% url 'member_signup' %}">
                        <span class="glyphicon glyphicon-plus" aria-hidden="true"></span>
                        {% trans 'New Member' %}
    </a>
 </div>

...

member / urls.py（如果有帮助）

urlpatterns = [
        url(r'^member_overview/$', views.member_overview.as_view(), name='member_overview'),
        url(r'^member_signup/$', views.member_signup, name='member_signup'),
        ...
]

Answer 1

可能是因为您已将[a]标记[href]的每一个设置为[location.pathname]末尾的反斜杠（例如＆＃39; /＆＃39;）后缀值值。

您可能需要为每个[a]代码[href]值

添加反斜杠（例如＆＃39; /＆＃39;）

$(document).ready(function() {
    $('li.active').removeClass('active');
    $('a[href="' + location.pathname + '/"]').closest('li').addClass('active');
});

希望这有助于您的案例

修改：如果用户访问＆＃39; member_signup＆＃39;您可能需要有条件。链路

示例：

$(document).ready(function() {
    $('li.active').removeClass('active');
    $('a[href="' + location.pathname + '/"]').closest('li').addClass('active');

    if (location.pathname === '/member_signup') {
       $('a[href="member_overview"]').closest('li').addClass('active');
    }
});

当我在子页面时，没有使导航父页面处于活动状态

...

1 个答案: