Django bootstrap按钮点击后激活active
现在有个需求,就是在导航栏上有若干个按钮,我想实现的功能是当点击某个按钮后修改文字颜色,这样网站会更人性化。现总结方法如下:
index.html:
<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
def home(reqeust):
isactive = "home"
return render(request, "home.html", {"isactive":isactive})
def about(reqeust):
isactive = "about"
return render(request, "about.html", {"isactive":isactive})

Django bootstrap按钮点击后激活active的更多相关文章
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮:激活状态
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- BootStrap中按钮点击后被禁用按钮的最佳实现方法
//禁用button $('button').addClass('disabled'); // Disables visually $('button').prop('disabled', true) ...
- Bootstrap 按钮
本章将通过实例讲解如何使用 Bootstrap 按钮.任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观.但是 Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示: ...
- Bootstrap按钮插件
前面的话 按钮插件提供了一组可以控制按钮多种状态的功能,比如按钮的禁用状态.正在加载状态.正常状态等.本文将详细介绍Bootstrap按钮插件 加载状态 通过按钮可以设计状态提示,当单击按钮时,会显示 ...
- Bootstrap -- 按钮样式与使用
Bootstrap -- 按钮样式与使用 1. 可用于<a>, <button>, 或 <input> 元素的按钮样式 按钮样式使用: <!DOCTYPE h ...
- 第二百四十七节,Bootstrap按钮和折叠插件
Bootstrap按钮和折叠插件 学习要点: 1.按钮 2.折叠 本节课我们主要学习一下 Bootstrap 中的按钮和折叠插件. 一.按钮 可以通过按钮插件创建不同状态的按钮,也就是点击后为选中状态 ...
- 吴裕雄 Bootstrap 前端框架开发——Bootstrap 按钮:按钮被点击
<!DOCTYPE html> <html> <head> <meta charset="utf-8"> <title> ...
- bootstrap 按钮 文本 浮动 隐藏
bootstrap 按钮 文本 浮动 隐藏 <!DOCTYPE html> <html lang="en"> <head> <meta c ...
- Bootstrap 按钮,图片,辅助类
Bootstrap 按钮 任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观.但是 Bootstrap 提供了一些选项来定义按钮的样式,具体如下表所示: 以下样式可用于<a&g ...
随机推荐
- Java高级开发_性能优化的细节
一.核心部分总结: 尽量在合适的场合使用单例[减负提高效率] 尽量避免随意使用静态变量[GC] 尽量重用对象,避免过多过常地创建Java对象[最大限度地重用对象] 尽量使用final修饰符[内联(in ...
- 石锤了!google彻底断供华为,只能加速鸿蒙生态的形成
前言 操作系统是当今科技行业的灵魂,而即将推出这款操作系统是一个集电脑.手机.汽车等设备于一体的系统.如今手机行业里已经是一片红海了,竞争相当激烈,但是竞争归竞争,但是一旦扯上别的事就更麻烦了,像华为 ...
- MongoDB Shell 命令
更新列名 db.Stores.update({}, {$rename : {"StoreId" : "MetaId"}}, false, true) 查询长度 ...
- 2019年上海市大学生网络安全大赛两道misc WriteUp
2019年全国大学生网络安全邀请赛暨第五届上海市大学生网络安全大赛 做出了两道Misc== 签到 题干 解题过程 题干提示一直注册成功,如果注册失败也许会出现flag. 下载下来是包含010edito ...
- 【Gamma】Scrum Meeting 7
前言 会议定点:大运村公寓 会议时间:2019/6/5 会议目的:明确下阶段目标 一.任务进度 组员 上周任务进度 下阶段任务 大娃 修复后端bug 辅助做好引导录屏 二娃 撰写会议博客 撰写会议博客 ...
- YYCache 的整体架构类图

- cad.net 读取pc3,pmp 读取pc3打印机文件
修改pc3文件还没做好..大家先look look怎么读.... 首先弄一个控制台程序, 然后去下载 Ionic.Zip 这个东西...载到控制台...都很简单... 然后就是复制下面代码,看控制台显 ...
- 【译】RAID的概念和RAID对于SQL性能的影响
简介 我们都听说过RAID,也经常作为SQL DBA.开发人员或构架师在工作中讨论RAID.但是,其实我们很多人都对RAID的原理,等级,以及RAID是如何影响SQL Server性能并不甚了解. 本 ...
- idea 本地调试,修改代码,代码自动生效
修改1: 修改2: ctrl+shift+a 弹出页面中搜索“registry” 修改3:修改configerations
- Java学习:泛型简介
泛型 泛型:是一种未知的数据类型,当我们不知道使用什么数据类型的时候,可以使用泛型 泛型也可以看出是一个变量,用来接受数据类型 E e : Element 元素 T t : Type 类型 Array ...