选项卡变得无响应

Tabs become unresponsive

我正在尝试按照本教程中的说明复制 "tabs" 部分:Google material Design. Everthing works fine except when I insert a date which uses a datepicker widget from this url: Datepicker。一旦我 select 日期,Megamenu 中的所有选项卡都会变得无响应

HTML 选项卡代码:

<ul class="nav nav-tabs" style="margin-bottom: 15px;">
    <li class="active"><a href="#home" data-toggle="tab">Home</a></li>
    <li><a href="#remindertab" data-toggle="tab">Reminder</a></li>
    <li class="dropdown">
        <a class="dropdown-toggle" data-toggle="dropdown" href="bootstrap-elements.html" data-target="#">
                 Reports <span class="caret"></span>
        </a>
         <ul class="dropdown-menu">
                <li><a href="#dropdown1" data-toggle="tab">Insurance History Between Dates</a></li>
                <li class="divider"></li>
                <li><a href="#dropdown2" data-toggle="tab">Insurance history of Account</a></li>
                <li class="divider"></li>
                <li><a href="#dropdown3" data-toggle="tab">Insurance Amount between dates</a></li>

        </ul>
    </li>
    <li><a href="#profile" data-toggle="tab">Bulletin Board</a></li>

        <p class="user" data-toggle="tab">Welcome Wasim(1117004017)</p>
</ul>

日期选择器脚本:

$("#dtBox").DateTimePicker();

这会像这样呈现 Megamenu:

我遇到的一件更奇怪的事情是,一旦选项卡变得无响应并且我单击 "Reports" 选项卡,我就会得到这个:

是DatePicker插件的问题。这行代码

$(document).unbind('click')

停止了bootstrap菜单的传播。