javascript - Django 后端如何动态设置前端 a 链接的 class 为 select 或 unselect？

Question

问个css问题。如下图所示：人才信息

就是当前页面的a链接css不一样
我看了一个他的源代码：

就是当首页面的a链接 是被选中的 class="select"
其它的链接是： class="unselect"

我是用django做后端，前端
如果根据cate.slug 来判断的话。那有多少个分类就要写多少个if语句了
不知道有什么更简单的功能来实现这个问题？ 多谢各位

Answer 1

本来就是应该每个都写if, 你这页面除了人才信息全都是固定 unselect 不变嘛?

Answer 2

在Django中，动态地设置前端<a>标签的class为select或unselect通常可以通过在模板中利用Django模板标签和模板过滤器来实现，而不需要为每个分类写单独的if语句。

假设你有一个视图，它传递一个变量（例如current_category）给模板，该变量包含了当前页面的分类信息。你可以使用模板标签来比较当前页面的分类和每个导航链接所代表的分类，并据此设置class。

以下是一个简化的示例，说明如何在Django模板中动态设置class：

{% for cate in categories %}    <a href="{% url 'category_detail' cate.slug %}"       class="{% if cate.slug == current_category.slug %}select{% else %}unselect{% endif %}">        {{ cate.name }}    </a>{% endfor %}

在这个例子中，categories是传递给模板的分类列表，而current_category是当前页面的分类对象。{% url 'category_detail' cate.slug %}是一个模板标签，用于生成指向每个分类详细页面的URL。

{% if cate.slug == current_category.slug %}select{% else %}unselect{% endif %}这部分代码使用了一个if语句来判断当前分类的slug是否与当前页面的分类slug相匹配。如果匹配，则设置class为select，否则为unselect。

请注意，你需要确保current_category在传递给模板的上下文中是可用的。这通常在视图中完成，如下所示：

# views.pydef category_detail(request, slug):    category = get_object_or_404(Category, slug=slug)  # 假设Category是你的模型    # ... 其他视图逻辑 ...    context = {        'categories': Category.objects.all(),  # 假设你想显示所有分类        'current_category': category,  # 将当前分类传递给模板    }    return render(request, 'template.html', context)

在这个视图示例中，category_detail函数获取与给定slug匹配的分类，并将其与所有分类一起传递给模板。current_category变量用于在模板中比较并设置正确的class。