实现bootstrap的dropdown-menu(下拉菜单)点击后不关闭的方法 (转)
-
问题描述,在下拉菜单中,添加其他元素,例如,原文作者所述的<a>和我自己实际用到的<input>,如果不加处理的话,那么在点击需要操作的元素的时候,由于事件传播的原因将会出现下拉菜单也隐藏掉的情况。
解决方法
1
$('.dropdown-menu a.removefromcart').click(function(e) {
e.stopPropagation();
});
指定要操作的元素的click事件停止传播2
$(function() {
$("ul.dropdown-menu").on("click", "[data-stopPropagation]", function(e) {
e.stopPropagation();
});
});
定义属性值data-stopPropagation的元素点击时停止传播事件
<ul class="dropdown-menu">
<li>
<-- Do not close when clicking this link -->
<a href="#" data-stopPropagation="true">
...
</a>
</li>
<li>
<-- Do not close when clicking this checkbox -->
<input type="checkbox" data-stopPropagation="true" ... >
</li><-- Do not close when clicking anything in this LI -->
<li data-stopPropagation="true">
...
</li>
</ul>
之后需要时加上该属性即可。
最新文章
- iphone如何导出微信聊天记录到电脑?
- 一、OWIN初探
- 在Ubuntu搭建.NET Core环境
- VC编译连接选项详解(转)
- css边框阴影问题
- 前端 - 使用gulp搭建es6运行环境
- [转]笔记本Ubuntu系统关闭独显+省电降温设置
- 解决 setOnItemClickListener,setOnScrollListener与setOnTouchListener事件冲突问题
- 一键部署Kubernetes高可用集群
- 白话C#语法新特性之元组
- DxPackNet 5.视频高质量的压缩和传输
- 菜鸟玩云计算之廿一: saltstack之pillar
- chrome主页被篡改为hao123 win10系统
- Configuring High Availability and Consistency for Apache Kafka
- 五十一、进程间通信——System V IPC 之进程信号量
- 架构师成长之路2.3-PXE+Kickstart无人值守大量部署Linux
- rabbitmq队列的exclusive,durability,auto-delete属性以及消息可靠传输设计
- poj 3268 最短路dijkstra *
- javascript 异步操作,串形执行,并行执行
- 淘宝API开发第一步