bootstrap的dropdown-menu(下拉菜单)点击选项后不关闭的方法

最新推荐文章于 2024-05-16 06:46:30 发布
最新推荐文章于 2024-05-16 06:46:30 发布
阅读量1.1k 收藏
点赞数 1
分类专栏： bootstrap 文章标签： javascript jquery bootstrap
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/qq_39396275/article/details/105764222
版权

HTML

在这里插入图片描述

//指定要操作的元素的click事件停止传播—定义属性值data-stopPropagation的元素点击时停止传播事件
$("#systemM").on('click','[data-stopPropagation]',function (e) {
							e.stopPropagation();
							
						});

在a标签加上属性 data-stopPropagation=”true”，然后在js加入指定要操作的元素的click事件停止传播

嫌疑-人
关注
  • 1
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
bootstrap下拉菜单dropdown点击后阻止自动收起菜单
南京小龙虾的博客
08-07 5036
公司有个切换院区的下拉框，使用的bootstrap的dropdown,以前是单选,因此点击切换后就会自动收起并且将数据传给后台，现在改成了多选，出现了一个问题就是点击一个后也会自动收起，这样的多选肯定是有问题的，因此在网上搜索了一下，找到了一种方法科室阻止菜单的点击自动收起 不废话，直接上代码 在生成dropdown-menu下的代码里，给每个<li>标签加一个属...
取消Bootstrap的dropdown-menu点击默认关闭事件方法
10-18
在描述的场景中，开发者遇到了一个问题：当用户在`dropdown-menu` 中点击一个列表项时，下拉菜单会立即关闭，这并不符合其应用程序的需求。为了解决这个问题，我们可以采取以下两种方法： **方法一：利用`data-...
实现bootstrap的dropdown-menu(下拉菜单)点击后不关闭的方法
灵云山的博客
09-29 9862
实现bootstrap的dropdown-menu(下拉菜单)点击后不关闭的方法 问题描述，在下拉菜单中，添加其他元素，例如，原文作者所述的和我自己实际用到的，如果不加处理的话，那么在点击需要操作的元素的时候，由于事件传播的原因将会出现下拉菜单也隐藏掉的情况。 解决方法 1 $('.dropdown-menu a.removefromcart').click(function(e)
ant-design-vue中使用a-menu刷新页面后菜单仍选中高亮
csdnyp的博客
07-07 4906
ant-design-vue中使用a-menu刷新页面后菜单仍选中高亮
Bootstrap中菜单栏使用dropdown和dropdown-menu，菜单栏中文字链接失效_data-bs-toggle=&quot；dropdown
最新发布
HUAXIAL的博客
05-16 891
最近遍览了各种网络安全类的文章，内容参差不齐，其中不伐有大佬倾力教学，也有各种不良机构浑水摸鱼，在收到几条私信，发现大家对一套完整的系统的网络安全从学习路线到学习资料，甚至是工具有着不小的需求。对于从来没有接触过网络安全的同学，我们帮你准备了详细的学习成长路线图。相比起繁琐的文字，还是生动的视频教程更加适合零基础的同学们学习，这里也是整理了一份与上述学习路线一一对应的网络安全视频教程。当然，当你入门之后，仅仅是视频教程已经不能满足你的需求了，你肯定需要学习各种工具的使用以及大量的实战项目，这里也分享一份。
Bootstrap dropdown a标签或者button 点击事件
weixin_30822451的博客
07-28 625
$(function() { $("ul.dropdown-menu").on("click", "[data-stopPropagation]", function(e) {　　 ////[data-stopPropagation]为选择器，li里面点击事件选择器 　　 e.stopPropagation(); }); });定义属性值data-stopPropagation的元素点...
仿大众点评——地区选择（阻止下拉列表框的消失）
qq_44997147的博客
12-20 228
实现图 代码 <template> <div id="app"> <div class="cf-flex dropdown"> <div class="cf-flex1" type="button" id="dropdownMenu1" data-toggle="dropdown" aria-haspopup="true" ari...
详解bootstrap用dropdown-menu实现上下文菜单
08-29
上下文菜单是一种特殊的菜单，它与一般菜单的区别在于，通过右键触发显示在鼠标右键点击处，鼠标在别处点击后，该菜单消失。这种菜单常用在图形界面中，例如，在一个图形编辑器中，用户可以右键点击某个图形元素，...
Bootstrap 下拉菜单.dropdown的具体使用方法
08-29
Bootstrap 下拉菜单.dropdown 是一个常用的前端组件，用于提供用户交互式的菜单选项。在 Bootstrap 框架中，下拉菜单.dropdown 是一个非常重要的组件，广泛应用于各种 web 应用程序中。下面我们将详细介绍 Bootstrap...
解决bootstrap中下拉菜单点击后不关闭的问题
10-18
总之，解决Bootstrap中下拉菜单点击后不关闭的问题，关键在于理解事件传播机制，并通过添加特定的事件监听器和属性来控制下拉菜单的关闭行为。通过这种方式，我们可以确保下拉菜单在需要的时候保持打开状态，提供更...
bootstrap-dropdown-hover：基于Bootstrap的响应式多级下拉导航菜单，带有引人入胜的动画
01-31
在本主题中，我们关注的是一个特定的Bootstrap扩展插件——`bootstrap-dropdown-hover`，它是一个响应式的多级下拉导航菜单，具有吸引人的动画效果。 这个插件的主要目的是改善Bootstrap默认的下拉菜单体验。在...
bootstraptable dropdown点击时停止转播
Bebrave的博客
06-18 266
1、设置data-stopPropagation=true $("#dataDetailDiv .dropdown-item").attr(“data-stopPropagation”, true); 2、强制停止转播 $(“body”).off(“click”).on(‘click’,’[data-stopPropagation]’,function (e) { e.stopPropagation(); });
element-ui NavMenu菜单组件垂直显示时点击其它区域关闭子菜单解决方法
weixin_34082177的博客
11-20 4095
element-ui 2.4.10的NavMenu组件mode为"vertical"，当子菜单展示时，如果点击子菜单以外的任何区域，会把打开的子菜单关闭，这个十分不合理，另外点击父菜单时，只会展开子菜单，更合理的方式是，点击父菜单，在展开子菜单的同时打开父菜单所指向的链接，或者打开第一个子菜单指向的链接。因为项目紧急，等不及官方更改，官方...
html点击下拉菜单后不刷新,解决bootstrap中下拉菜单点击后不关闭的问题
weixin_39959192的博客
06-04 461
bootstrap中常用到的下拉菜单dropdown-menu默认是当点击下拉菜单的任一位置就会关闭下拉菜单框了，这显然达不到很多用户需求，如何实现当点击需要点击的地方后才关闭下拉框呢，下面来简单介绍下方法，比如要做一个下拉框筛选查询，下拉菜单展示图如下：解决方法：指定要操作的元素的click事件停止传播—定义属性值data-stopPropagation的元素点击时停止传播事件//下拉框查询组件...
取消Bootstrap的dropdown-menu点击默认关闭事件
leehzl的博客
09-12 9130
我在一个div中生成的是一个多级列表，需要多次点击列表，找到对应的列表项，而Bootstrap默认在dropdown-menu中点击一次就会消失。
实现bootstrap的dropdown-menu(下拉菜单)点击后不关闭的方法 (转)
weixin_30545285的博客
07-26 534
实现bootstrap的dropdown-menu(下拉菜单)点击后不关闭的方法 问题描述，在下拉菜单中，添加其他元素，例如，原文作者所述的<a>和我自己实际用到的<input>，如果不加处理的话，那么在点击需要操作的元素的时候，由于事件传播的原因将会出现下拉菜单也隐藏掉的情况。 解决方法 1 $('.dropdown-menu a.removefromcar...
关于bootstrap下拉框组件点击后不自动关闭的处理
weixin_34203832的博客
04-17 1492
我们在使用bootstrap下拉框组件时，有时会有如下需求，比如，下拉框中有分页的需求，如果你点击翻页时那下拉框会自动关闭，再打开下拉框又会重新刷新，这肯定是不满足条件的。所以就会有点击后不关闭的需求。这种需求实现的方法其实不难，就两个步骤： 第一步：在你需要点击后不关闭的组件的标签中加入一个属性：data-stopPropagation="true"...
bootStrap dropdown-menu指定placement
05-20
Bootstrap 的 dropdown-menu 组件提供了一个 placement 属性，可以用来指定下拉菜单的位置。placement 属性可以设置为以下值之一： - top：将下拉菜单显示在触发元素的上方 - bottom：将下拉菜单显示在触发元素的...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值