Question

我正在使用Zurb的Reveal在网页上显示模态窗口。

我必须在已经打开的模态窗口上显示一个小模态窗口（后者包含一个表单）。

我将onclick="$('#ypopup').reveal();"添加到表单上的a元素，并将#ypopup（第二个模态div）的z-index设置为9999.这样第二个模式显示出来好。

但是当我关闭它时，不仅第二个模态消失了，而且第一个模态的背景也消失了。第一个模态仍然可见，但无法关闭。只有页面重新加载有帮助。

是否可以在打开的显示模式窗口上设置第二个显示模式？

Answer 1

我会说不。看看jQuery代码，看起来模态背景只是一个实例。关闭任何模态时，它会关闭页面上唯一的模态背景。您需要修改插件才能使其正常工作。

源代码可在此处找到：https://github.com/zurb/foundation/blob/master/vendor/assets/javascripts/foundation/jquery.foundation.reveal.js

Answer 2

将此添加到您的代码中：

$(document).on('closed.fndtn.reveal',function() { $('.reveal-modal').removeClass('toback'); })

这将导致所有显示都在揭示背景之上，从而拉动你的第一个显示。

Answer 3

......根本不是问题！

试试这个......

给每个模态一个唯一的ID＃... myModal1，myModal2，myModal3 ......等......
在文档中为每个模态添加一个单独的jquery函数...并相应地更改分区。

$（document）.ready（function（）{

 $('#at-button1').click(function(e) {
      e.preventDefault();
  $('#myModal1').reveal();
 });

  $('#at-button2').click(function(e) {
      e.preventDefault();
  $('#myModal2').reveal();
 });

 $('#at-button3').click(function(e) {
      e.preventDefault();
  $('#myModal3').reveal();
 });

第二个zurb Reveal Modal窗口 - 可能吗？

3 个答案: