通过单击离开它关闭模态弹出 [英] Closing Modal Popup by Clicking Away from It

问题描述

我使用本教程添加模态屏幕：

I am using this tutorial to add a modal screen:

http://raventools.com/blog/create-a-modal-dialog-using-css-and-javascript/

一切都很好，除非关闭它。而不是通过按钮关闭它，我想给用户选择关闭它通过点击模态外面，即在后面的页面的其余部分的背景。

Everything works great except closing it. Rather than closing it via a button, I want to give the user the option to close it by clicking outside of the modal, i.e. in the background of the rest of the page behind it.

用户告诉我将 onclick ='overlay（）'添加到overlay div $ c>< div id =overlayonclick ='overlay（）'>

A user told me to add onclick='overlay()' to the overlay div like this <div id="overlay" onclick='overlay()'>

当我尝试关闭模态点击外面，如果它，它的工作，但它也关闭，如果你点击实际的模态本身，我不想要，因为它是一个注册表单。那么有没有办法只通过点击实际模态本身之外的方式关闭模态？

When I try to close the modal by clicking outside if it, it works, but it also closes if you click on the actual modal itself, which I don't want as it is a registration form. So is there any way to only close the modal by clicking outside of the actual modal itself?

推荐答案

>

Try this:

$(document).ready(function(){
$('#overlay').bind('click', function(event){
    if (event.target == $('#overlay').get(0))
        overlay(); 
});

这篇关于通过单击离开它关闭模态弹出的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！