JQUERY clickout side element
I have multiple menues on my page...
<div class="menu">
<div>Menu header</div>
<div>Menu content</div>// should hide on click outside .menu
</div>
<div class="menu">
<div>Menu header</div>
<div>Menu content</div>// should hide on click out开发者_运维知识库side .menu
</div>
basically i need all the menu(s) to hide when a click is detected unless someone is clicking any of the menues it should hide any other menu(s) apart from the menu they clicked on.
I have seen a few that work but only if you have one menu on the page which is not exactly useful using stopPropagation as it may cancel any other necessary instructions;
any ideas would be appriciated.
Try:
$(document).click(function(evt) {
var menu = $(evt.target).closest("div.menu");
other = $("div.menu").not(menu).children(":last-child").hide();
menu.children(":last-child").show();
});
Basically this listens to all click()
events. It determines if it happened inside a menu item. If it did it shows the content and it hides the content of the others. Otherwise it hides all the menu content.
精彩评论