调用切换方法后，Bootstrap Dropdown不响应click

Question

我的导航栏中有一些Bootstrap Dropdown元素，如果用户滚动，应该隐藏这些元素。但是，在下拉列表上调用切换方法后，单击下拉列表不再切换下拉列表。

页面加载后，您可以滚动页面并通过单击反复切换下拉菜单。如果在下拉列表打开时滚动，JS将关闭打开的下拉列表。在此之后，您无法通过点击切换该下拉菜单。其他下拉菜单继续切换，直到您在下拉列表打开时滚动。

<nav>
<li class="menu-item menu-item-has-children dropdown">
    <a href="#" data-toggle="dropdown" class="dropdown-toggle" aria-haspopup="true" aria-expanded="false"><span class="dropdown-header"></span>About Our Company</a>
    <div role="menu" class=" dropdown-menu">
        <div class="container">
            <div class="row">
                <section class="widget menu-post-widget-2 menu-post-widget-class">
                    <div class="row">
                        ...
                    </div>
                </section>
            </div>
        </div>
    </div>
</li>
</nav>

JS：

$(window).on('scroll', function(){
    // Close the drop down on scroll
    $('nav .dropdown.open').dropdown('toggle');
});