Question

我是一个java脚本，可以让我的文件在侧边栏中保持活动状态。但是每次切换到第2页时它都会被取消激活，因为我正在使用分页：

我的ul li代码在这里： -

<li>
<a href="#" class="dropmenu"> <i class="fa fa-newspaper-o fa-lg margin_right5"></i> <span>News Management</span>
</a>
<ul>
<li class=" "><a href="{% url 'cms:news-list' %}" class="submenu"><span class="">News List</span></a></li>
<li class=" "><a href="{% url 'cms:news-reported' %}" class="submenu"><span class="">Reported News</span></a></li>
</ul>
</li>

我尝试了什么： -

<li>
<a href="#" class="dropmenu"> <i class="fa fa-newspaper-o fa-lg margin_right5"></i> <span>News Management</span>
</a>
<ul>
<li class="{% if request.path =='/news/list'%} active {% endif%} "><a href="{% url 'cms:news-list' %}" class="submenu"><span class="">News List</span></a></li>
<li class=" "><a href="{% url 'cms:news-reported' %}" class="submenu"><span class="">Reported News</span></a></li>
</ul>
</li>

但是在分页的情况下它不起作用。

Answer 1

对于菜单的这种活跃性，有一个独特的解决方案。假设你有超过20或30个网址，你必须在那里写下50个条件。所以不要试试这个，

为每个<a>标记提供sidemenu类并循环遍历所有sidemenu元素并将其与当前url匹配，现在假设您的网址为'/news-list'且位置路径为/app/new-list，则会为此<a>元素提供有效课程

$('.sidemenu').each(function(i, obj) {
        var current_url = location.href.split('/'); // split the current url to get the last part of the url
        var lastSegment = current_url.pop() || current_url.pop();  // handle potential trailing slash
        var getlast = lastSegment.split('?'); // split your get parameters to remove them
        var a = getlast[0]; # get the actual url by accessing the first element of array

        var get_sidebar_url = $(obj).attr('href').split('/'); 
        var lastSegment2 = get_sidebar_url.pop() || get_sidebar_url.pop();  // handle potential trailing slash
        var getlast2 = lastSegment2.split('?');
        var b = getlast2[0];

        # match that your last part of url is matching with your current url , if yes then give active class to li
        if (b.startsWith(a) || a.endsWith(b)) {
            $(obj).parent('li').addClass('active');
        }else{
            $(obj).parent('li').removeClass('active')
        }
    });

编辑：但如果您需要临时解决方案，那么您需要改变，

将{％request.path％}更改为

{% if request.resolver_match.url_name  == 'news-list(your_actual_urlname)' %}
  active
{% endif %}

在django模板中使用分页时保持li活动？

1 个答案: