请问下segmentfault中user settings页面右边的li在点击刷新后是怎么记住的?

WBOY
Libérer: 2016-06-06 20:49:09
original
1231 Les gens l'ont consulté

请问下segmentfault中user settings页面右边的li在点击刷新后是怎么记住的?

如图所示,我点击了工作教育经历后,页面刷新了,此时激活的项目变成了工作教育经历了,请问这是怎么实现的?

是后台传给前台哪个li被激活了?还是采用其他的实现方法?

回复内容:

请问下segmentfault中user settings页面右边的li在点击刷新后是怎么记住的?

如图所示,我点击了工作教育经历后,页面刷新了,此时激活的项目变成了工作教育经历了,请问这是怎么实现的?

是后台传给前台哪个li被激活了?还是采用其他的实现方法?

根据 URL 传入参数 $tab 判断当前页

<code class="lang-php"><li if> class="current"<?php endif; ?>>xxx</li>
<li if> class="current"<?php endif; ?>>xxx</li>
</code>
Copier après la connexion

首先,感谢你邀请我回答。然后你所谓的激活,其实就是给li赋上了一个class="current"属性而已,至于如何判断,这个就更简单了。

SegmentFault 这个应该是在后端判断的,这个 WordPress 等程序的主题里头就有写,想法应该是跟你那个一样,每个都判断一下是否为当前页,是则加,不是则不加。

不过最近写静态博客的主题,发现他们有这么一个思路。程序有一个extendsblock函数,可以定义父模板和复写项,比如我在base.html中这样定义了

<code><li block index endblock>你好我是首页</li>
<li block user endblock>你好我是用户页</li>
<li blcok article endblock>你好我是文章页</li>
</code>
Copier après la connexion

然后我在用户页中这么写

<code>{% extends 'base.html' %} {# 表示把base.html继承了过来 #}

{% block user %} class="current"{% endblock %} {#表示给上面定义的一个可以复写项赋值#}
</code>
Copier après la connexion

那么最终我的用户页就会呈现这样的效果

<code><li>你好我是首页</li>
<li class="current">你好我是用户页</li>
<li>你好我是文章页</li>
</code>
Copier après la connexion

这样也能达到目的。当然你也可以选择在前端判断,给每个li增加一个对应的class,最好和URL的调用名称一致,然后根据URL的值直接赋值给对应的对象就成了。

总的来说就是,如果你不想给<li>增加单独的标识的话,就只能后台/前端一个一个判断咯,如果增加了单独标识的话就可以快速一点,后端/前端都不局限就是。

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!