如何打开基金会揭示模态javascript

Question

我一直在尝试遵循基础文档，但我真的无法弄清楚如何使用jQuery打开模态窗口。这就是我所拥有的：

Fiddle

HTML：

<a href="#" id="myModal" class="reveal-link">Name</a>

<div id="myModal" class="reveal-modal">
      <a class="close-reveal-modal">&#215;</a>
</div>

jQuery的：

$(document).ready(function(){
    $(document).foundation();
    $('a.reveal-link').trigger('click');
    $('a.close-reveal-modal').trigger('click');
 });

谢谢，任何帮助将不胜感激！

Answer 1

您错误地在<a>和<div>标记上设置了相同的ID。

两种方法：

1. 您的模式的ID为“myModal”，因此您应将属性data-reveal-id='myModal'设置为<a>标记。您已设置id="myModal"，您应将其删除。您正在使用的JavaScript应该可以使用此更改。

2. 将<a>代码的ID更改为id="modalLaucher"，然后使用：

   $("#modalLauncher").click(function (e) {
       $('#myModal').foundation('reveal', 'open');
   });