I have that button in my mobile website; the problem is, that I need to add a method that when the user clicks or taps outside the menu the menu closes.
我的移动网站上有那个按钮;问题是,我需要添加一个方法,当用户点击或点击菜单外,菜单关闭。
Can someone direct me please?
有人可以指点我吗?
2 个解决方案
#1
10
Fiddle Link : http://jsfiddle.net/eAGjM/
小提琴链接:http://jsfiddle.net/eAGjM/
You'll need to check if the clicked portion is neither the Menu nor its child element. If your menu contains child element then this check is required otherwise clicking on sub elements will also hide the menu.
您需要检查点击的部分既不是Menu也不是它的子元素。如果您的菜单包含子元素,则需要进行此检查,否则单击子元素也会隐藏菜单。
$(document).mouseup(function(e){
var menu = $('selector');
if (!menu.is(e.target) // The target of the click isn't the container.
&& menu.has(e.target).length === 0) // Nor a child element of the container
{
menu.hide();
}
});
#2
0
You can do something like below to hide/close the menu
您可以执行以下操作来隐藏/关闭菜单
$(document).click(function(){
$(your class/id).hide('slow');
});
Here is Fiddle
这是小提琴
Instead of menu i have just shown a simple example for click
而不是菜单我刚刚显示了一个简单的点击示例
#1
10
Fiddle Link : http://jsfiddle.net/eAGjM/
小提琴链接:http://jsfiddle.net/eAGjM/
You'll need to check if the clicked portion is neither the Menu nor its child element. If your menu contains child element then this check is required otherwise clicking on sub elements will also hide the menu.
您需要检查点击的部分既不是Menu也不是它的子元素。如果您的菜单包含子元素,则需要进行此检查,否则单击子元素也会隐藏菜单。
$(document).mouseup(function(e){
var menu = $('selector');
if (!menu.is(e.target) // The target of the click isn't the container.
&& menu.has(e.target).length === 0) // Nor a child element of the container
{
menu.hide();
}
});
#2
0
You can do something like below to hide/close the menu
您可以执行以下操作来隐藏/关闭菜单
$(document).click(function(){
$(your class/id).hide('slow');
});
Here is Fiddle
这是小提琴
Instead of menu i have just shown a simple example for click
而不是菜单我刚刚显示了一个简单的点击示例