如果在它之外点击隐藏div

我在使用这个JQuery函数时遇到了一些麻烦。

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

如果你点击打开的div之外的任何地方（在点击第一个div之后出现），我想把它放在哪里，打开的div关闭。

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

Answer 1

编辑：这里更好的方法：
如何创建自定义模式弹出窗口 – 以及如何在其外部单击它关闭它

---

jsBin演示

 $( "#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(); } }); 

Answer 2

希望这可以帮助：

 $(document).click(function() { if($(window.event.target).attr('id') != 'idSelect') $("#idDiv").hide(); }); 

Answer 3

jQuery-outside-events插件增加了对以下事件的支持

clickoutside，dblclickoutside，focusoutside，bluroutside，mousemoveoutside，mousedownoutside，mouseupoutside，mouseoveroutside，mouseoutoutside，keydownoutside，keypressoutside，keyupoutside，changeoutside，selectoutside，submitoutside。

适用于您的情况，您可以这样做

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

在这里演示

Answer 4

 $(document).on("click",function(e) { if ($(e.target).is("#idDiv, #idDiv *")) $("#idDiv").show(); else $("#idDiv").hide(); });