前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >Django bootstrap按钮点击后激活active

Django bootstrap按钮点击后激活active

原创
作者头像
marsggbo
修改2019-08-12 17:10:29
9670
修改2019-08-12 17:10:29
举报

现在有个需求,就是在导航栏上有若干个按钮,我想实现的功能是当点击某个按钮后修改文字颜色,这样网站会更人性化。现总结方法如下:

index.html:

代码语言:txt
复制
<ul class="navbar-nav mr-auto">
	<li class="nav-item">
		<a class="nav-link {% if isactive == 'home' %}active{% endif %}" href="{% url 'home' %}">Home</a>
	</li>
	<li class="nav-item">
		<a class="nav-link {% if isactive == 'about' %}active{% endif %}" href="{% url 'about' %}">About</a>
	</li>
</ul>

app.views.py

代码语言:txt
复制
def home(reqeust):
	isactive = "home"
	return render(request, "home.html", {"isactive":isactive})
	
def about(reqeust):
	isactive = "about"
	return render(request, "about.html", {"isactive":isactive})

<footer style="color:white;;background-color:rgb(24,24,24);padding:10px;border-radius:10px;"><br>

<h3 style="text-align:center;color:tomato;font-size:16px;" id="autoid-2-0-0"><br>

<b>MARSGGBO</b><b style="color:white;"><span style="font-size:25px;">♥</span>原创</b>

<b style="color:white;">

2019-8-12<p></p>

</b><p><b style="color:white;"></b>

</p></h3><br>

</footer>

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

原创声明:本文系作者授权腾讯云开发者社区发表,未经许可,不得转载。

如有侵权,请联系 cloudcommunity@tencent.com 删除。

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档