使用基础和Turbolinks与Rails 4的麻烦

时间:2014-08-06 01:26:51

标签: javascript jquery ruby-on-rails zurb-foundation turbolinks

我有一个包含2个按钮的标题:登录并注册Like this。 当我点击其中一个时,会出现一个窗口:window open。为此,我使用了基础(Reveal Modal)的“显示模态”。

我的问题:如果我点击链接打开我的网站的新页面并尝试打开/关闭登录或注册弹出窗口,窗口将关闭,但这次阴影停留(like this)和我需要按F5再次进行此操作。

我使用Rails 4和基础5。

文件_header.html.erb(查看部分)

<div class="large-12 columns header">
  <div class="logo">
    logo
  </div>
  <div class="infos">
      <ul>
        <li><a href="#" class="" data-reveal-id="login">Login</a></li>
        <li><a href="#" class="" data-reveal-id="signup">Sign up</a></li>
      </ul>
  </div>
</div>

<div id="login" class="reveal-modal" data-reveal>
  <p>
    Page Test 
  </p>
</div>

<div id="signup" class="reveal-modal roundish" data-reveal>
  <p>
    Page Test 
  </p>
</div>

文件application.js

//= require jquery
//= require turbolinks
//= require foundation
//= require bxslider/jquery.bxslider.min.js
//= require home
//= require_tree .

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

感谢您的帮助。

2 个答案:

答案 0 :(得分:7)

这适用于turbolinks进度条和基础选项卡,手风琴

//= require jquery
//= require jquery_ujs
//= require foundation
//= require turbolinks
//= require_tree .

var ready;
ready = function() {
  $(document).foundation();
};
$(document).ready(ready);
$(document).on('page:load', ready);

答案 1 :(得分:-3)

问题是Turbolinks。

解决方案:将//= require turbolinks放在最后

//= require jquery
//= require bxslider/jquery.bxslider.min.js
//= require foundation
//= require home
//= require_tree .

$(document).foundation();

//= require turbolinks

感谢@AlexAube的帮助! :)