通过Javascript打开和关闭Reveal模式

时间:2018-07-30 07:45:50

标签: javascript zurb-foundation

我正在尝试通过Javascript打开和关闭Reveal模式...

我有这个HTML

<div class='reveal-modal' id='first-modal' data-reveal>
   I'm the firstborn!
   <a class='open-second'>Click me!</a>
</div>
<div class='reveal-modal' id='second-modal' data-reveal>
   I'm the secondborn!
   <a class='close'>Close modal</a>
</div>
<a class='open-first'>Click me!</a>

以及以下Javascript ...

// There's no need to close a previous modal before you
// open another one.
$('a.open-first').on('click', function() {
  $('#first-modal').foundation('reveal','open');
});
$('a.open-second').on('click', function() {
  $('#second-modal').foundation('reveal', 'open');
});
$('a.close').on('click', function() {
  $('#second-modal').foundation('reveal', 'close');
});

但是,我看到以下错误...

app.js:16078 Uncaught ReferenceError: We're sorry, 'reveal' is not an available method for Reveal.
    at jQuery.fn.init.foundation (app.js:16078)
    at HTMLAnchorElement.<anonymous> (app.js:14672)
    at HTMLAnchorElement.dispatch (app.js:5026)
    at HTMLAnchorElement.elemData.handle (app.js:4831)

外面有人可以告诉我为什么这不起作用吗?

谢谢!

1 个答案:

答案 0 :(得分:0)

我设法找到答案...

这只是删除“显示”的问题,因此...

$('a.open-first').on('click', function() {
  $('#first-modal').foundation('open');
});
$('a.open-second').on('click', function() {
  $('#second-modal').foundation('open');
});
$('a.close').on('click', function() {
  $('#second-modal').foundation('close');
});