html5-bootstrap的选中问题(active类)

问题描述

bootstrap的选中问题(active类)

请问一下在多个标签下选中的标签一般不是用active类表示选中吗,那我选中了一个标签要再选中另外一个标签,那之前被选过的标签要怎么修改去除被选中的样式?用哪个类?还是用js清除样式?

解决方案

$(document).ready(function () {
$('ul.nav > li').click(function (e) {
e.preventDefault();
$('ul.nav > li').removeClass('active');
$(this).addClass('active');

});

});

解决方案二:

$(document).ready(function () {
$('ul.nav > li').click(function (e) {
e.preventDefault();
$('ul.nav > li').removeClass('active');
$(this).addClass('active');

});

});

时间: 2024-12-02 13:46:35

html5-bootstrap的选中问题(active类)的相关文章

springmvc mybatis oracle mysql maven HTML5 bootstrap 全新技术

获取[下载地址]   QQ: 313596790A 调用摄像头拍照,自定义裁剪编辑头像 [新录针对本系统的视频教程,手把手教开发一个模块,快速掌握本系统]B 集成代码生成器 [正反双向](单表.主表.明细表.树形表,开发利器)+快速构建表单;  技术:313596790 freemaker模版技术 ,0个代码不用写,生成完整的一个模块,带页面.建表sql脚本,处理类,service等完整模块C 集成阿里巴巴数据库连接池druid;  数据库连接池  阿里巴巴的 druid.Druid在监控.可扩

JS模拟bootstrap下拉菜单效果实例_javascript技巧

本文实例讲述了JS模拟bootstrap下拉菜单效果.分享给大家供大家参考,具体如下: 模拟bootstrap下拉菜单 在工作中要切一个效果:点击导航栏,则出现下列菜单,但是当点击其他地方的时候,就隐藏子菜单,效果有点类似于bootstrap 的"下拉菜单" 由于bootstrap的子菜单的样式与设计不同,因此需要自己写一个类似的效果 当点击某个控件的时候,则显示出下拉菜单,但是,当点击空白的地方的时候怎么让其自动隐藏呢? 起初的想法,给body绑定一个onclick事件,当点击空白的

Bootstrap作品展示站点实战项目2_javascript技巧

假设我们已经想好了要给自己的作品弄一个在线站点.一如既往,时间紧迫.我们需要快一点,但作品展示效果又必须专业.当然,站点还得是响应式的,能够在各种设备上正常浏览,因为这是我们向目标客户推销时的卖点.这个项目可以利用Bootstrap的很多内置特性,同时也将根据需要对Bootstrap进行一些定制. 1.设计目标 虽然对大屏幕中的展示效果已经胸有成竹,但我们还应该从小设备开始,强迫自己聚焦在关键的要素上面. 这个作品展示站点应该具有下列功能: □ 带Logo的可折叠的响应式导航条: □ 重点展示四

图解css3:核心技术与案例实战. 2.7 UI元素状态伪类选择器

2.7 UI元素状态伪类选择器 UI元素状态伪类选择器也是CSS3选择器模块组中的一部分,主要用于form表单元素上,以提高网页的人机交互.操作逻辑以及页面的整体美观,使表单页面更具个性与品位,而且使用户操作页面表单更便利和简单. 2.7.1 UI元素状态伪类选择器语法 UI元素的状态一般包括:启用.禁用.选中.未选中.获得焦点.失去焦点.锁定和待机等.在HTML元素中有可用和不可用状态,例如表单中的文本输入框:HTML元素中还有选中和未选中状态,例如表单中的复选按钮和单选按钮.这几种状态都是C

【BootStrap】栅格系统、表单样式与按钮样式-附有源码

转载请注明出处http://blog.csdn.net/qq_26525215 本文源自[大学之旅_谙忆的博客] 栅格系统 1.栅格系统介绍 Bootstrap 提供了一套响应式.移动设备优先的流式栅格系统随着屏幕或视口viewport尺寸的增加系统会自动分为最多12列. Bootstrap的栅格系统由一个行(.row)和多个列构成. 栅格系统用于通过一系列的行row与列column的组合来创建页面布局你的内容就可以放入这些创建好的网页布局中.具体的数据(文字.图片等都可以)放入列当中. 注意栅

Yii2框架BootStrap样式的深入理解

Yii2框架默认采用了bootstrap作为CSS风格,各种视图类组件都如此.之前一直采用默认风格,并在必要的时候添加或者修改一下class来达到目的.但在改版Yii1.1的orange项目时,发现之前也是套的模板,其实没有好好去理解一下bootstrap的那套规则,所以顺便大致梳理一下吧.以basic模板为例,对照http://v3.bootcss.com/css/ 上的内容进行. 看layouts/main.PHP,Yii2默认以HTML5文档类型进行的了,但语言默认是en-US,所以要改,

【博文推荐】ASP.NET MVC4+BootStrap实战

本博文出自51CTO博客BruceAndLee博主,有任何问题请进入博主页面互动讨论! 博文地址:http://leelei.blog.51cto.com/856755/1587301 OK,不多说了,看一下Solution的截图 基本上一看就明白了,控制器调用Biz层,Biz层调用DAL层,DAL层进行数据的CURD.Utility是一些公用的类库.ok,为什么程序集的命名都是以Bruce开头呢,因为我在公司的英文名叫这个.废话不多说,我们先看一下页面 我们引入了BootStrap,主要是为了

bootstrap读书笔记之CSS组件(上)_javascript技巧

bootstrap三大核心之二. 包括glyphicon图标,下拉菜单(dropdown),按钮组(button group)....等等.一. 图标字体 bootstrap3提供了200多个免费图标字体.认为它是一个字. arial-hidden="true" .sr-only(只读) 1. 引入方法: <i class="glyphicon glyphicon-search"></i> i标签是已经废弃了的html斜体标签.用span也可

全面解析Bootstrap布局组件应用_javascript技巧

本文示例介绍了Bootstrap布局组件应用,分享给大家供大家参考,具体内容如下 字体图标的应用示例 <button type="button" class="btn btn-default"> <span class="glyphicon glyphicon-sort-by-attributes"></span> </button> 下拉菜单示例 <div class="dropd