Bootstrap 切换侧边栏从外部标签指向活动标签

q5iwbnjs  于 2023-11-15  发布在  Bootstrap
关注(0)|答案(1)|浏览(160)

我使用引导切换侧边栏到我的网站。我使用侧边栏内的nav-pills。我想积极和点的确切标签跟随主页,个人资料,联系人。如果我点击主页导航准确点到主页标签面板后,打开侧边栏。
我试过下面的脚本。

$(document).ready(function () {   
    $('#dismiss, .overlay').on('click', function () {
        $('#sidebar').removeClass('active');
        $('.overlay').removeClass('active');
    });

    $('#sidebarCollapse').on('click', function () {
        $('#sidebar').addClass('active'); 
        var tab = e.target.hash;
            $('.tab-content .tab-pane' + tab + '"]').tab("active");             
    });
});

字符串
我的代码here
截图供参考:


的数据

oalqel3c

oalqel3c1#

我将很快地通过你的问题的主要问题。
1.你缺少了函数参数--在你的
.).on('click',function(){. var tab = e.target.
e未定义。它应该是函数参数(也称为evente):

...).on('click', function (e) {
        ...
        var tab = e.target...

字符串
1.你有无效的标记--你的代码的另一个问题是你的页面中有重复的id。你不能在页面中有多个元素具有相同的id。当你需要为多个元素分配行为或样式时,使用classes,而不是ids。
1.您修改了库的标记--继续往下,即使您修复了缺少参数和重复id的问题,您也会很快发现e.target没有hash属性,因为目标不再是锚标记<a>,而是<span>。为什么?最有可能的是,你改变了它,因为你认为它看起来更像一个<span>, Package 在一个<button>。也许它确实如此,但你可以很容易地通过将btn btn-info类应用到<a>,而不会破坏图书馆的功能。
1.你没有读过文档--Bootstrap Sidebar的好处在于,它不像其他更阴暗的库,只是提供一些代码,而不是解释一切,对于这个库,你可以找到一个高质量的,高度详细的tutorial,它是如何工作的,以及你在实现它时的选择。
该教程是为你而写的。在你阅读并应用它之后,如果你仍然在使用库时遇到问题,请更新你的问题。

相关问题