如何将点击事件附加到引导选项卡

How to attach click event to a Bootstrap tabs?

本文关键字：选项 事件      更新时间：2023-09-26


我的引导选项卡有问题。我想创建一个带有子菜单的基于选项卡的菜单。在所有选项卡上都附加了一个mouseenter事件，所以当我用鼠标指针输入选项卡时，子菜单中会出现链接。但有些选项卡不需要子菜单，所以我需要在它们上附加一个单击事件，该事件可以识别我单击的选项卡并将我重定向到页面。我附上了点击事件的代码：

 $('#mainTabPanel a').click(function (e) {
    e.preventDefault();
    var $destination = $(this);
    if ($destination.hash === "#about") {
        window.location.replace("http://stackoverflow.com");
    }
});

但它不起作用。你能帮我吗？

编辑

我在JsFiddle中做了一个例子：https://jsfiddle.net/Romanus91PL/a12m71pf/5/

当我点击"必应链接"主播时，他们会将我重定向到Bing.com网站。我也想将这样的事件应用到"关于"选项卡（当我单击它时，它应该会将我重定向到bing网站）。

如果我正确理解你的问题，这个怎么办

$(function () {
    $('#mainTabPanel a').mouseover(function (e) {
        e.preventDefault();
        $(this).tab('show');
    });
    $('#mainTabPanel a').click(function(e) {
        e.preventDefault();
        if (this.hash === "#about") {
            window.location.replace("https://bing.com");
        }
    });
});

https://jsfiddle.net/szepiet83/myqo4wx7/

请尝试下面给定的代码。它可能对你有帮助。。

$(document).on( 'shown.bs.tab', 'a[data-toggle="tab"]', function (e) {
       console.log(e.target) // activated tab
    })
相关文章：