Question

我正试图在我的网页上获得一个基金会5揭示模式。

继承我所拥有的：

的Gemfile：

gem 'foundation-rails', '~> 6.0'
gem 'jquery-rails'
gem 'query-ui-rails'

的application.js

//= require jquery
//= require jquery_ujs
//= require jquery-ui
//= require autocomplete-rails
//= require foundation
//= require turbolinks
//= require_tree .

$(function(){ 
    $(document).foundation(); 
});

show.html.erb

<a href="#" data-reveal-id="myModal" class=" small button">Click Me For A Modal</a>

<div id="myModal" class="reveal-modal" data-reveal aria-labelledby="modalTitle" aria-hidden="true" role="dialog">
  <h2 id="modalTitle">Awesome. I have it.</h2>
  <p class="lead">Your couch.  It is mine.</p>
  <p>I'm a cool paragraph that lives inside of an even cooler modal. Wins!</p>
  <a class="close-reveal-modal" aria-label="Close">&#215;</a>
</div>

我按照此处的说明操作：http://foundation.zurb.com/sites/docs/v/5.5.3/components/reveal.html

我希望它能够显示并完全按照其基本示例的方式工作，但它无法正常工作。

现在我可以显示模态按钮，当你点击它时，页面会刷新，然后显示模态的内容，我无法关闭它。在我刷新页面之前它一直保持打开状态。

渲染如下：

我不明白我错过了什么。从我读过的所有内容中，因为我已经在我的应用程序中安装了基础，所以我应该拥有所有必要的组件来使其正常工作。

在页面的下方，他们提到：

在你使用Reveal之前，你需要验证jQuery和 foundation.min.js可在您的页面上找到。你可以参考有关设置的Javascript文档。

我对此foundation.min.js一无所知。我下载了完整的Foundation库并尝试将该文件添加到app/assets/javascripts/foundation.min.js，然后将<script src="/js/foundation.min.js"></script>添加到application.html.erb中的<head>，但这也没有任何区别。

此时我不知道我错过了什么。他们的模态不起作用，模态的基础样式甚至没有被应用。有人可以帮助我吗？

Rails基金会揭示莫代尔不起作用

0 个答案: