javascript Zurb Foundation Reveal Modal - 防止后台点击关闭
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/21922511/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
Zurb Foundation Reveal Modal - preventing close on background click
提问by alexs333
When I am opening my Reveal Modal, I would like to prevent it from closing on background click (which is a default behavior).
当我打开我的Reveal Modal 时，我想防止它在后台点击时关闭（这是默认行为）。
I am using Zurb Foundation 5.0.2.
我正在使用 Zurb Foundation 5.0.2。
Any help would be appreciated.
任何帮助，将不胜感激。
回答by Dave Sag
If you set the closeOnBackgroundClickoption to falsethen your modalwon't close when you click in the background.
如果您将该closeOnBackgroundClick选项设置为，false则modal当您在后台单击时不会关闭。
<div class="reveal-modal" data-options="closeOnBackgroundClick:false">
回答by Rav's Patel
Yehhhhh Finally Found It:
Yehhhhh 终于找到了：
Put below code on your foundation reveal model. Than it not close by clicking on background or by pressing esc key.
将以下代码放在您的基础揭示模型上。通过单击背景或按 esc 键不会关闭它。
data-options="close_on_background_click:false;close_on_esc:false;"
数据选项="close_on_background_click:false;close_on_esc:false;"
Ex:
前任：
<div id="AccessContainer" class="reveal-modal" data-reveal data-options="close_on_background_click:false;close_on_esc:false;">
</div>
回答by Brianne Hostutler
For anyone looking at this question in 2018, I'm using Version 6.4.0 and this works:
对于在 2018 年查看此问题的任何人，我使用的是 6.4.0 版，这有效：
data-close-on-click="false" data-close-on-esc="false"
I added that to the reveal div like this and it's working (as of July 2018):
我将它添加到这样的显示 div 并且它正在工作（截至 2018 年 7 月）：
<div class="reveal" id="modalVideo" data-reveal data-close-on-click="false" data-close-on-esc="false">
回答by Chris Peacock
You can achieve this globally by executing the following line of JavaScript before showing any modals:
您可以通过在显示任何模态之前执行以下 JavaScript 行来全局实现此目的：
Foundation.libs.reveal.settings.close_on_background_click = false;
回答by Saran
For latest version of foundation by zurb use following snippet
对于 zurb 最新版本的基础，请使用以下代码段
<div id="myModal" class="reveal-modal" data-options="close_on_background_click:false" data-reveal>
Complete Code will look like
完整的代码看起来像
<a href="#" data-reveal-id="myModal" id="dd">Click Me For A Modal</a>
<div id="myModal" class="reveal-modal" data-options="close_on_background_click:false" data-reveal>
<h2>Awesome. I have it.</h2>
<p class="lead">Your couch. It is mine.</p>
<p>I'm a cool paragraph that lives inside of an even cooler modal. Wins!</p>
<a class="close-reveal-modal">×</a>
</div>回答by Trent Turner
If using the stand-alone Reveal plugin here: https://zurb.com/playground/reveal-modal-plugin
如果在此处使用独立的 Reveal 插件：https: //zurb.com/playground/reveal-modal-plugin
Use the following on the link that opens the modal.
在打开模态的链接上使用以下内容。
<a href="#" data-reveal-id="myModal" data-closeonbackgroundclick="false">Open Modal</a>
回答by NateW
This answer applies to Foundation 6. Below are the correct option for both preventing close on background click (closeOnClick:false;) and preventing close via the Esckey (closeOnEsc:false;).
此答案适用于Foundation 6. 以下是防止在后台单击 ( closeOnClick:false;) 时关闭和防止通过Esc键 ( closeOnEsc:false;)关闭的正确选项。
<div class="reveal" id="exampleModal1" data-reveal
data-options="closeOnClick:false; closeOnEsc:false;">
