javascript - 关闭模态对话框屏幕

Question

我目前正在为注册页面在我的网站上实现一个模式对话框屏幕，为了节省您的时间，我不会撒谎说我正在学习本教程 - http://raventools.com/blog/create-a-modal-dialog-using-css-and-javascript/

一切正常，除了它没有显示如何在用户点击对话框外部时关闭对话框，就像在它周围的其他 body 上一样。

我该怎么做？

谢谢你的帮助

Answer 1

您只需从您想要触发关闭的任何事件中再次调用 overlay()。它切换叠加层的可见性(如果叠加层可见，则调用 overlay() 将其隐藏，反之亦然):

function overlay() {
    el = document.getElementById("overlay");
    el.style.visibility = (el.style.visibility == "visible") ? "hidden" : "visible";
}

您也可以考虑使用类似 jQuery UI's dialog widget 的东西.