祖尔布基金会 4 揭示模态：不会关闭

Question

我使用的是带有Reveal 4.3.2和jQuery 2.0.3的Foundation 4.3.1。我用以下代码成功地以编程方式打开了一个模态：

$('.akita-modal-ajax').on('click', function (e) {
    e.preventDefault();
    var modalId = $(this).data('id'),
        url = $(this).attr('href');
    $('#' + modalId).foundation('reveal', 'open', {
        url: url;
    });
});

我用来尝试关闭模态的代码是：

$('.akita-modal').on('click', '.close-reveal-modal',function () {
    console.log('click');
    $('.akita-modal').foundation('reveal', 'close');
});

我的模态（一旦打开）：

<div id="myModal" class="akita-modal open" style="display: block; opacity: 1; visibility: visible; top: 50px;">
    <a class="close-reveal-modal">×</a>
    ...More content...
</div>

当我点击关闭模态时，它会在控制台中注册"点击"，但模态仍处于打开状态。有趣的是，如果我忽略我的自定义类，并将"akita modal"的所有引用恢复为"explore modal"，那么一切都会正常工作。但后来我被Reveal的默认风格卡住了。

我也试过：

$('.akita-modal').on('opened', function () {
    $('.akita-modal').on('click', '.close-reveal-modal',function () {
        console.log('click');
        $('.akita-modal').foundation('reveal', 'close');
    });
});

结果完全相同。"点击"会被记录下来，但模态仍处于打开状态。我的控制台中没有其他错误，除了JoelCDoyle在回答另一个SO问题时可能遇到的问题外，我也没有遇到其他人遇到这个问题：在Foundation 4 中揭示模态

如何使用自己的类名关闭此模态？

Answer 1

通常我使用模态Id来关闭它，如下所示：

$('#myModal').foundation('reveal', 'close');

它是有效的，所以使用类名而不是ID可能是个问题。。。？

Answer 2

实际上，当您忘记属性"data-shape"时，可能会发生这种情况。应该这样写：

<div class="reveal-modal" data-reveal>
...
</div>