如果在其外部点击隐藏div [英] hide div if clicked outside of it

问题描述

我对这个JQuery函数有点麻烦。

I’m having a little trouble with this JQuery function.

基本上，我有一个div，点击后会显示另一个Div。实际上，它设置为切换，因此当您单击时它会打开/关闭。

Basically, I have a div, that when clicked, shows another Div. It’s set to a toggle, actually, so it toggles on/off when you click.

如果您点击打开的div之外的任何地方，我想让它在哪里（单击第一个div后出现，打开的div将关闭。

I want to have it where if you click on anywhere outside of the opened div (that appears after you click on the first div), the div that was opened is closed.

$("#idSelect").click(function() {
   $("#idDiv").toggle();
});

推荐答案

编辑：更好这里的方法：

如何创建自定义模式弹出窗口 - 以及如何关闭它在其外部点击

---

jsBin demo

EDIT : A better approach here:
How to create a custom modal popup - and how to close it clicking outside of it

---

jsBin demo

$( "#idSelect" ).click(function( e ) {
   e.stopPropagation();
   $("#idDiv").toggle();
});

$( "#idDiv" ).on('click',function( e ) {
     e.stopPropagation();
});

$( document ).on('click', function( e ) {
   if( e.target.id != 'idDiv' ){
       $( "#idDiv" ).hide();
   }   
});

这篇关于如果在其外部点击隐藏div的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！