javascript - 防止基于页面上现有的另一个类的默认点击操作

Question

我有以下 CSS 代码，当单击 .dashboard-actions 类时会打开一个下拉菜单。单击树中的第二个 div 后，dropdown 更改为 class="dropdown open"(表示下拉菜单打开/可见)，一旦用户单击关闭，open 类将被删除并且下拉菜单消失(如预期的那样)。

我希望能够使用某种形式的 javascript(AngularJS 1.3 或 jQuery)能够执行一些逻辑来识别下拉列表何时“打开”- 如果是这样，如果用户单击屏幕上的其他任何地方，例如div 下方的 href 将通过删除“打开”类而不是执行该默认操作来打开“关闭”下拉菜单，我怎样才能最好地解决这个问题？

<div class="dashboard-actions ellipsis">
   <div class="dropdown" stop-event>
      <div class="dropdown-toggle" type="button" id="dropdown1" data-toggle="dropdown" aria-haspopup="true" aria-expanded="true">
           <span class="material-icons">more_vert</span>
      </div>
        <ul class="dropdown-menu" aria-labelledby="dropdown1">
           <div>
            <div ng-include src="'templates/menu.html'" ng-repeat="x in item.x"></div>
          </div>
        </ul>
   </div>
</div>
<div class="interaction-body">
  <a href="https://somecdn.com/t51.2885-15/aaa.jpg" ng-href="https://somecdn.com/t51.2885-15/aaa.jpg" target="_blank" stop-event="">
  <img ng-src="https://somecdn.com/t51.2885-15/aaa.jpg" src="https://somecdn.com/t51.2885-15/aaa.jpg"></a>
</div>

Answer 1

希望你正在寻找这个

//Some code

$('.dropdown-menu').each({
    if($(this).hasClass('open')){
        // Do something
        // $(this).removeClass('open');
    }
});

//More code