Javascript 切换-显示后，导航栏中的Bootstrap 3下拉列表立即隐藏

正如在这个JSFIDLE中所演示的，我有一个带有2个下拉菜单的导航栏。第一个下拉列表中的链接触发一个JS click事件，我在其中手动显示第二个下拉列表。它可以工作，只是在显示后，第二个下拉列表会自动立即隐藏。我添加了一个警告，让您有时间在第二个下拉列表隐藏之前查看它

复制/粘贴JSFIDLE代码：

如果您想知道我为什么这么做：在我们的应用程序中，下拉菜单2显示了一个登录表单。有时，单击下拉列表1中的菜单链接会显示登录表单

jQuery 1.9.1-引导3.0.0 发生在Chrome和Firefox上

我是一个新手，我确信我做错了。非常感谢你的帮助。 约翰。

试着这样做：

同时阻止事件传播。否则，它会导致执行引导的默认下拉处理，当您单击链接时，它会折叠所有下拉列表

$(".SwitchLink").click(function(e) {
            e.preventDefault();
            e.stopPropagation();// prevent the default anchor functionality
            $('#DropDown2').dropdown('toggle');
            alert("wait here... see DropDown2 deployed, then close this alert and see it's gone.");
});

---

尝试在document.ready上添加此脚本。为我写的

$（函数（）{
$（“[data toggle=dropdown]”）。prop（'onclick'，null）。off（'click'）；
$（“[数据切换=下拉]”）。单击（函数（e）{
e、 预防默认值（）；
e、 停止传播（）；
设el=$（此）；
让expanded=el.attr（“aria expanded”）| | false；
如果（！展开）{
$（this.dropdown（'toggle'）；
}
});
});你能给你的答案添加更多细节吗？这将更容易解决问题：）。
$(document).ready(function() {
        $("#SwitchLink").click(function(e) {
            e.preventDefault();// prevent the default anchor functionality
            $('#DropDown2').dropdown('toggle');
            alert("wait here... see DropDown2 deployed, then close this alert and see it's gone.");
        });
    });

$(".SwitchLink").click(function(e) {
            e.preventDefault();
            e.stopPropagation();// prevent the default anchor functionality
            $('#DropDown2').dropdown('toggle');
            alert("wait here... see DropDown2 deployed, then close this alert and see it's gone.");
});