当前位置: 代码迷 >> 综合 >> Bootstrap data-toggle 的使用
  详细解决方案

Bootstrap data-toggle 的使用

热度:72   发布时间:2023-09-27 12:56:11.0

今天在写代码的时候很心塞,之前也经常用这个,然而今天因为疏忽一直无法正常跳转,真的是写代码一点都不能大意啊!

html代码:

<ul class="nav nav-tabs" id="myTab"><li class="active"><a href="#one">第一页</a></li><li><a href="#two">第二页</a></li><li><a href="#three">第三页</a></li><li><a href="#four">第四页</a></li>
</ul><div class="tab-content"><div class="tab-pane active" id="one">第一页内容..</div><div class="tab-pane" id="two">第二页内容...</div><div class="tab-pane" id="three">第三页内容..</div><div class="tab-pane" id="four">第四页内容..</div>
</div>

其中注意,切换按钮用的是ul不是div不要弄错

接下来是我今天漏掉的地方,呜呜,我竟然忘记了冒泡事件以及单个激活,心塞塞

js:

    $('#myTaba').click(function (e) {e.preventDefault();$(this).tab('show');})

好啦,更多应用大家可以去官网。以我为例,希望大家以后写代码的时候细心再细心

  相关解决方案