单击删除下拉子菜单
remove dropdown submenu onclick
单击项目时如何删除或隐藏下拉子菜单。我们使用了css的引导程序。请帮帮我。这是密码。
<ul class="dropdown-menu" style="display: block; position: static;">
<li class="dropdown-submenu active" id="xyz">
<a href="#" id="family-1" class="family_type" style="display: block; color: rgb(73, 162, 20);">
<label style="margin-right: 20px; width: 50px;"><img src="images/families/automotive_1.jpg"></label>Automotive
</a>
<ul class="dropdown-menu">
<li class="family_id" id="1"><a style="cursor: pointer;" id="535" name="Fluid" class="masterTooltip">Fluid</a></li>
<li class="family_id" id="1"><a style="cursor: pointer;" id="543" name="Power" class="masterTooltip">Power Fluid</a></li>
</ul>
</li>
<li class="dropdown-submenu active" id="xyz">
<a href="#" id="family-2" class="family_type">
<label style="margin-right: 20px; width: 50px;"><img src="images/families/batteries.jpg"></label>Batteries
</a>
<ul class="dropdown-menu">
<li class="family_id" id="2"><a style="cursor: pointer;" id="685" name="Batteries" class="masterTooltip">Batteries</a></li>
<li class="family_id" id="2"><a style="cursor: pointer;" id="104" name="eries" class="masterTooltip">eries</a></li>
</ul>
</li>
</ul>
这是我的css代码。
.dropdown-submenu{position:relative;}
.dropdown-submenu>.dropdown-menu{top:0;left:100%;margin-top:-6px;margin-left:-1px;-webkit-border-radius:0 6px 6px 6px;-moz-border-radius:0 6px 6px 6px;border-radius:0 6px 6px 6px;}
.dropdown-submenu:hover>.dropdown-menu{display:block;}
.dropdown-submenu>a:after{display:block;content:" ";float:right;width:0;height:0;border-color:transparent;border-style:solid;border-width:5px 0 5px 5px;border-left-color:#3EA861;margin-top:5px;margin-right:-10px;}
.dropdown-submenu:hover>a:after{border-left-color:#3EA861;}
.dropdown-submenu{float:none;}.dropdown-submenu>.dropdown-menu{margin-right:10px;-webkit-border-radius:6px 0 6px 6px;-moz-border-radius:6px 0 6px 6px;border-radius:6px 0 6px 6px;}
请帮帮我。
演示:http://jsfiddle.net/3mrw4rzk/
$(document).ready(function(){
$('.masterTooltip').on('click', function(){
var $parent = $(this).parent().parent().parent();
//console.log($parent);
$parent.hide();
});
});
你的代码有一个问题,即你对不同的项目使用相同的id,在html中id应该是唯一的。
相关文章:
- 单击删除下拉子菜单
- 删除“;选择“;从下拉菜单的选项中选择
- 如何使用jstree删除上下文菜单中的编辑选项
- 如果今天是会计年度的最后一天,请从下拉菜单中删除当前年份
- 单击“下一个”和“上一个”时,如何从导航菜单中添加和删除类
- 使用Selenium WebDriver单击下拉菜单不会激活Javascript来添加或删除页面中的项目
- 当我的响应菜单打开时,我如何删除用户转到侧面的功能
- 删除二级UL中的“子菜单”类
- 删除其他下拉菜单中的选定项目
- 如何在更改屏幕大小时删除功能(菜单响应)
- 当我单击标记而不是删除它时,我应该做些什么来创建自定义菜单
- 使用 javascript 从选择菜单中删除匹配的选项
- jQuery根据下拉菜单中的选择创建和删除字段
- 单击文本框的右键单击上下文菜单的“删除”后触发的事件
- 如何在 jquery 中删除 UI 选择菜单
- 在给定条件下使用 jquery 删除类,以便对子菜单进行专有对齐
- JQuery 根据单击的菜单项添加/删除类
- 如何在下拉菜单中只加载当前和将来的事件并删除旧事件
- 删除Ionic/Angular JS中基于侧菜单的模板中的导航栏
- 我可以通过javascript使用上下文菜单检测用户删除吗