Javascript 用于活动药丸更改的Bootstrap 3 jquery事件

我的目标是超载引导导航帕尔点击事件，我很高兴遇到

我已经按照下面的方式修改了代码，使其适用于药片，但我无法理解为什么它不起作用

HTML:

---

引导程序和选项卡使用相同的javascript。只是

.nav药片

而不是

.nav标签

不同

---

将

data toggle=“pill”

替换为

data toggle=“tab”

到处都可以使用。在Bootstrap中，nav是一个样式化组件，而不是js组件。因此，数据切换将是

data toggle=“tab”

为您的代码更新Fiddle

只需要更改

---

-帮助：）

@EdgarNavasardyan是

<ul class="nav nav-pills" id="orders_tab">
                <li class="active"><a data-toggle="pill" href="#orders_for_today">Текущие</a></li>
                <li><a data-toggle="pill" href="#orders_sent_to_vendors">Ожидающие</a></li>
                <li><a data-toggle="pill" href="#inventories">Остатки</a></li>
                <li><a data-toggle="pill" href="#sales">Продажи</a></li>
                <li><a data-toggle="pill" href="#sales_aggregate">Аггрегированные продажи</a></li>
                <li role="presentation" class="dropdown">
                    <a class="dropdown-toggle" data-toggle = "dropdown" href="#" role="button" aria-haspopup="true" aria-expanded="false">
                      Прочее <span class="caret"></span>
                    </a>
                    <ul class="dropdown-menu">
                        <li><a href="#">Action</a></li> 
                        <li><a href="#orders_products">Продукты</a></li>
                    </ul>
                </li>
            </ul> 

$('a[data-toggle="pill"]').on('shown.bs.pill', function (e) {
        var target = $(e.target).attr("href") // activated tab
        alert(target);
    });

data-toggle="tab"