Javascript 单击同级时关闭下拉菜单

我一直有问题，试图使这项工作

我有一个子菜单，当我点击它的同级时，我想点击它的同级ul

我在这里进行了研究，尝试了几件事，但都没有结果

这就是我的代码现在的样子，切换正常：

if ( $(window).width() < 740) { 
        $('.submenu').click(function(e){
             e.stopPropagation();
            e.preventDefault();
            var el = (e.target || e.srcElement);
            var $this = $(this);

            $(el).siblings('ul').slideToggle();
            $(el).siblings('ul').addClass('activeState');
            if( $this.siblings().hasClass('activeState')){
                $this.slideUp();
            }
            $(el).find('span').toggleClass('bg-arrow-down bg-arrow-up');
        });
    }

if（$（窗口）.width（）<740）{
$（“.子菜单”）。单击（函数（e）{
e、 停止传播（）；
e、 预防默认值（）；
var el=（e.target | | e.src元素）；
var$this=$（this）；
$（el）.同级（'ul'）.slideToggle（）；
$（el）.同级（'ul'）.addClass（'activeState'）；
if（$this.sibles（）.hasClass（'activeState'））{
$this.slideUp（）；
}
$（el）.find（'span'）.toggleClass（'bg-arrow-down-bg-arrow-up'）；
});
}

这或多或少就是我的HTML的样子。它有各种各样的子菜单，这些是我试图让它工作的菜单

<div class="panel panel-default">
            <!-- <div class="nav-item-container"> -->
                <div class="panel-heading head-category">
                    <div class="panel-title">
                        <span><a href="http://www.yahoo.com">Products</a></span>
                        <a data-toggle="collapse" href="#menuPanelListGroup">
                                <i class="pull-right fa fa-chevron-down" aria-hidden="true"></i>
                        </a>
                    </div>
                </div>
                <ul class="list-group collapse out" id="menuPanelListGroup">
                    <li class="list-group-item children-list-group">
                        <a data-toggle="collapse" href="#menuPanelSubListGroup">
                            <span>Item 1</span>
                            <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                        </a>

                        <ul id="menuPanelSubListGroup" class="collapse children-list-sublink">
                            <li class="list-group-item children-list-group">
                                <span><a href="#">SubItem 1</a></span>
                            </li>
                            <li class="list-group-item children-list-group">
                                <span>SubItem 2</span>
                            </li>
                            <li class="list-group-item children-list-group">
                                <span>SubItem 3</span>
                            </li>
                        </ul>

                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 2</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 3</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 4</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 5</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                </ul>
            <!-- </div> -->

            <!-- <div class="nav-item-container"> -->
                <div class="panel-heading head-category">
                    <div class="panel-title">
                        <span><a href="#">Latin Markets</a></span>              
                        <a data-toggle="collapse" href="#menu2PanelListGroup">
                            <i class="pull-right fa fa-chevron-down" aria-hidden="true"></i>
                        </a>
                    </div>
                </div>
                <ul class="list-group collapse out" id="menu2PanelListGroup">
                    <li class="list-group-item children-list-group">
                        <a data-toggle="collapse" href="#menu2PanelSubListGroup">
                            <span>Item 1</span>
                            <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                        </a>

                        <ul id="menu2PanelSubListGroup" class="collapse children-list-sublink">
                            <li class="list-group-item children-list-group">
                                <span><a href="#">SubItem 1</a></span>
                            </li>
                            <li class="list-group-item children-list-group">
                                <span>SubItem 2</span>
                            </li>
                            <li class="list-group-item children-list-group">
                                <span>SubItem 3</span>
                            </li>
                        </ul>

                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 2</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 3</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 4</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 5</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                </ul>
            <!-- </div> -->

            <!-- <div class="nav-item-container"> -->
                <div class="panel-heading head-category">
                    <div class="panel-title">
                        <span><a href="#">Shows</a></span>
                        <a data-toggle="collapse" href="#tradeshowPanelListGroup">
                                <i class="pull-right fa fa-chevron-down" aria-hidden="true"></i>
                        </a>
                    </div>
                </div>
                <ul class="list-group collapse out" id="tradeshowPanelListGroup">
                    <li class="list-group-item children-list-group">
                        <a data-toggle="collapse" href="#tradeshowPanelSubListGroup">
                            <span>Item 1</span>
                            <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                        </a>

                        <ul id="tradeshowPanelSubListGroup" class="collapse children-list-sublink">
                            <li class="list-group-item children-list-group">
                                <span><a href="#">SubItem 1</a></span>
                            </li>
                            <li class="list-group-item children-list-group">
                                <span>SubItem 2</span>
                            </li>
                            <li class="list-group-item children-list-group">
                                <span>SubItem 3</span>
                            </li>
                        </ul>

                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 2</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 3</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 4</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                    <li class="list-group-item children-list-group">
                        <span>Item 5</span>
                        <b class="pull-right glyphicon glyphicon-chevron-right"></b>
                    </li>
                </ul>

分项2


分项3




项目2


项目3


项目4


项目5








分项2


分项3




项目2


项目3


项目4


项目5








分项2


分项3




项目2


项目3


项目4


项目5

---

只是若语句不起作用。

不确定你们在哪里并没有看到这种情况发生——若你们把窗口宽度作为窗口宽度，它可能是，也可能不是。下面的代码运行良好，我添加了maxWidth值，而不是硬编码您使用的740

我想是的