下拉菜单实现问题

This topic created in 2634 days ago, the information mentioned may be changed or developed.

<div>
<span class="btn">下拉菜单</span>
    <div class="dropmenu">
        <span>菜单一</span>
        <span>菜单二</span>
    </div>
</div>

想实现的效果，点击 btn，dropmenu 显示。点击页面其他 body 地方 dropmenu 消失。
遇到的问题是如果点击 dropmenu 也会触发绑定到 body 的事件，这个如何解决？
点击 dropmenu 里的菜单需要进行一些而外操作

9 replies • 2019-05-25 14:51:10 +08:00

cydysm

May 24, 2019

```
<div>
<span class="btn">下拉菜单</span>
<div class="dropmenu">
<span>菜单一</span>
<span>菜单二</span>
</div>
</div>
```

我先改下缩进

Hilong

May 24, 2019 via Android

@cydysm 哈哈哈，回复不支持 markdown，傻眼了吧

Hilong

May 24, 2019 via Android

冒泡捕获啊

Exia

May 24, 2019

阻止菜单按钮冒泡就行

cydysm

May 25, 2019 via iPhone

@Hilong 改完以后…我看到就傻眼了

redbuck

May 25, 2019 via iPhone

还有个办法，菜单 show 才给 body 加监听，hide 就移除监听

redbuck

May 25, 2019 via iPhone

@redbuck
加监听是指关闭菜单的回调

zarte

May 25, 2019

@Exia 应该是这个，谢谢

zarte

May 25, 2019

@redbuck 不是这个，按楼上阻止冒泡应该可以。