Zurb Foundation 6 Reveal 不起作用 [英] Zurb Foundation 6 Reveal doesn't work

查看：33 发布时间：2021/10/5 19:25:36 zurb-foundation zurb-foundation-6

本文介绍了Zurb Foundation 6 Reveal 不起作用的处理方法，对大家解决问题具有一定的参考价值，需要的朋友们下面随着小编来一起学习吧！

问题描述

我已经下载了新的 Zurb Foundation 6 完整包(网站基础).存档文件包含以下文件和文件夹:

[css] >app.css、foundation.css、foundation.min.css[图像] >[空文件夹][js] >应用程序.js基础.js基础.min.js供应商 >jquery.min.js, what-input.min.js

我在页脚中包含了 JS 文件，在页眉中包含了 CSS:

<script src="/Foundation/js/foundation.min.js"></script><脚本>$(文档).基础();

Chrome 中的错误

我尝试使用 REVEAL 组件(它在 Foundation 5 中有效)，但这次它抛出了一个错误:

Uncaught ReferenceError: 很抱歉，'reveal' 不是 i 的可用方法.

我查看了 Foundation.min.js 的内部，其中包含 REVEAL.我下载了完整的包，所以它应该可以工作，但它没有.

应该触发模态的JS代码:

$('#submit-modal').foundation('reveal', 'open');

更新 1: 在新页面上尝试:

<html xmlns="http://www.w3.org/1999/xhtml"><head runat="服务器"><title></title><link href="/Foundation/css/foundation.min.css" rel="stylesheet"/><身体><div class="row">这是页面的主体</div><div id="popup-modal" class="reveal-modal full" data-reveal aria-labelledby="pop-up-modal-title" aria-hidden="true" role="dialog">测试

<script src="/Foundation/js/vendor/jquery.min.js"></script><script src="/Foundation/js/vendor/what-input.min.js"></script><script src="/Foundation/js/foundation.js"></script><脚本>$(文档).基础();</html>

弹出的文本出现在页面上，默认情况下甚至不隐藏，我收到一个错误:Uncaught ReferenceError: We're sorry, 'Reveal' is not a available method for Reveal 尝试运行命令时:

$('#popup-modal').foundation('reveal', 'open');

来自控制台.

Foundation 6 是一个新版本，我可能错过了一些东西.我从 Foundation 5 升级到 Foundation 6.Foundation 5 Reveal 工作正常，但在更改为新的 Foundation 6 后，一些组件开始无法正常工作.

我检查了文档，初始化和类是一样的.

解决方案

尝试使用

var popup = new Foundation.Reveal($('#popup-modal'));

然后:

popup.open();

$('#popup-modal').foundation('reveal', 'open'); 不再适用于 Foundation 6.

I've downloaded the new Zurb Foundation 6 complete package (Foundation for Sites). The archived file contains the following files and folders:

[css] > app.css, foundation.css, foundation.min.css
[img] > [empty folder]
[js]  >
  app.js
  foundation.js
  foundation.min.js
  vendor > jquery.min.js, what-input.min.js

I included the JS file in the footer and the CSS at the header:

<!-- foundation library and initialization -->
<script src="/Foundation/js/foundation.min.js"></script>
<script>
  $(document).foundation();
</script>

Error in Chrome

I try to use REVEAL component (it worked in Foundation 5), but this time it throws me an error:

Uncaught ReferenceError: We're sorry, 'reveal' is not an available method for i.

I've looked inside the Foundation.min.js and it has REVEAL in it. I download the complete package, so it should work, but it doesn't.

The JS code that should trigger the modal:

$('#submit-modal').foundation('reveal', 'open');

UPDATE 1: Tried on a fresh page:

<!DOCTYPE html>

<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
    <title></title>
    <link href="/Foundation/css/foundation.min.css" rel="stylesheet" />
</head>
<body>
    <div class="row">this is the body of the page</div>
     <div id="popup-modal" class="reveal-modal full" data-reveal aria-labelledby="pop-up-modal-title" aria-hidden="true" role="dialog">
         test
     </div>

<script src="/Foundation/js/vendor/jquery.min.js"></script>

<!-- foundation library and initalization -->
<script src="/Foundation/js/vendor/what-input.min.js"></script>
<script src="/Foundation/js/foundation.js"></script>

<script>
    $(document).foundation();
</script>

</body>
</html>

The text of the popup appeared on the page, it's even not hidden by default, and I get an error: Uncaught ReferenceError: We're sorry, 'Reveal' is not an available method for Reveal when trying to run the command:

$('#popup-modal').foundation('reveal', 'open');

From the console.

Foundation 6 is a fresh release, and I;ve might missed something. I upgraded to Foundation 6 from Foundation 5. Foundation 5 Reveal worked ok, but after changing to the new Foundation 6 some components start not working out.

I checked the Documentation and the initialization and classes are the same.

解决方案

Try with

var popup = new Foundation.Reveal($('#popup-modal'));

and then:

popup.open();

$('#popup-modal').foundation('reveal', 'open'); doesn't work in Foundation 6 anymore.

这篇关于Zurb Foundation 6 Reveal 不起作用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！

查看全文

Zurb Foundation 6 Reveal 不起作用 [英] Zurb Foundation 6 Reveal doesn't work

问题描述

相关文章

其他开发最新文章

热门教程

热门工具

登录关闭

Zurb Foundation 6 Reveal 不起作用 [英] Zurb Foundation 6 Reveal doesn&#39;t work

问题描述

相关文章

其他开发最新文章

热门教程

热门工具

登录 关闭

Zurb Foundation 6 Reveal 不起作用 [英] Zurb Foundation 6 Reveal doesn't work

登录关闭