第一个下拉菜单隐藏在第二个下拉单击事件上

Question

我在单个页面中使用2个codrops dropdwon菜单。 当用户单击第二个下拉菜单时，我想关闭第一个下拉菜单。

我在我的项目中使用以下代码。

<select id="Select1" class="cd-select">
    <option value="-1" selected>Menu 1</option>
    <option value="7" >subMenu1</option>
    <option value="8" >subMenu2</option>
    <option value="9" >subMenu3</option></select>

// 2nd Menu
<select id="Select2" class="cd-select">
    <option value="-1" selected>Menu 2</option>
    <option value="2" >subMenu1</option>
    <option value="5" >subMenu2</option></select>

.aspx页面Java脚本

<script type="text/javascript">
    $(function () {
        $('#Select1').dropdown({
            gutter: 5,
            stack: false,
            delay: 100,
            slidingIn: 100
        });
        $('#Select2').dropdown({
            gutter: 5,
            stack: false,
            delay: 100,
            slidingIn: 100
        });
    });
</script>

我想结束Select1对，当用户点击Select2 。 请给我建议。 帮我。

• JSFiddle在这里

Answer 1

更新：检查此问题的答案： jQuery下拉菜单，通过单击外部关闭

我将其添加到您的小提琴中，它可以正常工作，但是下拉列表失去了布局。 您可以在单击另一个下拉列表而不是$（document）时尝试调用hide（）函数。

Answer 2

我找到了解决方案-我只是将这段代码放在document.ready()函数中，并且可以正常工作。

$('.cd-dropdown').click(function() {
$('.cd-active').not($(this))
        .removeClass('cd-active')
        .children('ul').css('height', 'auto')
        .children('li').css('top', 0);});

谢谢