Bootstrap Tab 手动切换

编程教程 > WEB (2013) 2024-11-26 14:39:04

 

Bootstrap Tab 手动切换

Bootstrap Tab 示例代码

<div class="tabs-container">
	<ul class="nav nav-tabs">
		<li class="active"><a data-toggle="tab" href="#tab-1" aria-expanded="true">TB1</a></li>
		<li class=""><a data-toggle="tab" href="#tab-2" aria-expanded="false">TB2</a></li>
		<li class=""><a data-toggle="tab" href="#tab-3" aria-expanded="false">TB3</a></li>
	</ul>
	<div class="tab-content">
		<!--TB1-->
		<div id="tab-1" class="tab-pane active">
			<div class="panel-body">
				<div class="example">
					TB1
				</div>
			</div>
		</div>
		<!--TB2-->
		<div id="tab-2" class="tab-pane">
			<div class="panel-body">
				TB2
			</div>
		</div>

		<!--TB3-->
		<div id="tab-3" class="tab-pane">
			<div class="panel-body">
				TB3
			</div>
		</div>
	</div>
</div>

Bootstrap Tab 手动切换代码


切换到tab-2
 

$('.nav-tabs a[href="#tab-2"]').tab('show');

 


 

 


评论
User Image
提示:请评论与当前内容相关的回复,广告、推广或无关内容将被删除。

相关文章
Bootstrap Tab 示例代码&lt;div class="tabs-container"&gtl; &lt;ul class="nav nav-tabs"&gtl; &lt;l...
Bootstrap-tab 组件增强插件效果图​​bootstrap-tab组件是对原生的bootstrap-tab组件的封装,方便开发者更方便地使用,主要包含以下功能:tab页初始化关闭tab...
Bootstrap Tab基础使用,首先是引入必要的css和js,这里暂时忽略核心代码:&lt;ul class="nav nav-tabs"&gtl; ...
该插件是基于bootstrap框架开发的一个table插件,功能强大实用性强展示结果截图:1.下载bootstrap table插件,下载2.导入插件相关的cs
​Bootstrap TableBootstrap Table 多选以及获取多选值实现本文主要讲解在bootstrap table组建使用过程中,配置多选和获取多选选中的值
在Bootstrap Table 使用过程中,从表格的columns里面的value取一些特殊字符的值会被转义,比如 &符号会被转义城&amp;
问题描述最近一个项目遇到Bootstrap Table pageList 配置不生效,配置多个选项后无法还是无法弹出选择
在使用bootstrap-table过程中,我们可能会遇到列属性events事件不能生效的问题,并会发现这个问题有时存在有时却又不存在,这是什么原因呢?其实造成events事件失效的原因非常简单...
Bootstrap Table 后端分页详解防坑$('#tableId').bootstrapTable({ method:'post',//请求方法 url:'',//后台地址 p...
 bootstrapValidator 创建/重置/手动验证使用详解  bootstrapValidator 初始化  function initValidator() { $("#d...
CKEditor 5 不重新构建移除某个plugin控件组件参考代码:ClassicEditor .create( document.querySelector...
CKeditor5 默认情况下的fontsize组件是小号默认大号特大号这种,没有具体的字体大小px单位选择,有些时候需要配置。故而对默认配置进行了修改。配置方式如下: C...
依赖说明tabler icons 3.11.0 (基于webfont模式实现)fontIconPicker 3.1.1jquery 3.6.0 实现效果打开选择
尽管现在前端技术发展飞速发展,各种技术迭代很快,但jQuery还是在一些企业站或者简单网页尝尝用到,本文记录一下学写jQuery插件的内容,愿新手共勉,共同进步
方案一$("#dialog-modal").modal({backdrop:"static",//点击空白处不关闭对话框show:false,//按esc键盘不关闭.})方案二在弹框元素(下面以...