所以我在这里快疯了。我对编码很陌生，不知道如何解决这个问题。
我正在使用 ruby 2 和arshaw 的 FullCalendar 制作 Rails 4 应用程序。
正确的脚本出现在头部。调用日历的 JQuery 脚本位于 head 中。日历正在运行。问题在于，日历处于用户从标题中的链接导航到的不同 View 中。日历不会出现，但会在刷新页面时出现。
我不知道为什么会发生这种情况，但我认为这与头部的初始化脚本需要存在 div id='calendar' 有关。直到调用后面的 View 之前它才具有此功能，于是我记忆起头脑中的脚本并且一切正常。
我将在此处修补尽可能多的代码，完整的代码可在以下位置找到:
https://github.com/joesus/MtgCal
到目前为止，我已经尝试使用 Controller 刷新页面，但我不知道如何做到这一点，而不会让我进入无限循环，而且它只刷新 View 的那部分，所以它不会无论如何，有帮助。
我尝试过使用 js 超时，但似乎只刷新了部分 View ，而不是整个页面，所以它不起作用。
这是我的布局:application.html.erb
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=Edge,chrome=1">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title><%= content_for?(:title) ? yield(:title) : "1311 York St" %></title>
<%= csrf_meta_tags %>
<%= render 'layouts/shim' %>
<%= stylesheet_link_tag "application", :media => "all" %>
<%= render 'layouts/device_specific' %>
<%= javascript_include_tag "application" %>
<!-- Tried calling the script from partial _cal.html.erb instead of a .js file with the same info,
didn't fix anything, not sure why I thought it might. -->
</head>
<body>
<!-- <div id='calendar' style='display: none'></div>
Thought I could initialize it in the layout
then call it again in the schedule view. Didn't work. -->
<%= render 'layouts/header' %>
<p id="bodytop"></p>
<%= bootstrap_flash %>
<%= yield %>
<%= render 'layouts/footer' %>
</div>
</body>
</html>
这是我初始化日历的脚本: /assets/javascripts/initialize.js
$(document).ready(function() {
// page is now ready, initialize the calendar...
//
$('#calendar').fullCalendar({
events: 'http://www.google.com/calendar/feeds/.../public/basic',
weekMode: 'liquid',
height: 600,
defaultView: 'agendaWeek',
allDaySlot: false,
header: {
left: 'title',
center: 'agendaDay,agendaWeek,month',
right: 'today prev,next'
}
});
});
这在本地主机的头部中显示为:
<script src="/assets/jquery-ui-1.10.3.custom.min.js?body=1"></script>
这就是我调用日历的地方:/views/layouts/static_pages/schedule.html.erb
<h1>Meetings</h1>
<div id='calendar'></div>
基本上，当我导航到在主布局中呈现的 View 时，我需要找出某种方法来刷新头部中的信息。
如有任何建议，我们将不胜感激。再说一次，整个事情都在 github 上，所以也许我在其他地方破坏了一些东西来解释这一点。
谢谢， 乔
更新:
我实现了 Erowlin 的解决方案，现在我的 initalize.js 如下所示:
$(document).on('ready page:load', function(){
$('#calendar').fullCalendar({
events: 'http://www.google.com/calendar/feeds/..../public/basic',
weekMode: 'liquid',
height: 600,
defaultView: 'agendaWeek',
allDaySlot: false,
header: {
left: 'title',
center: 'agendaDay,agendaWeek,month',
right: 'today prev,next'
},
windowResize: function(view) {
if ($(window).width() < 514){
$('#calendar').fullCalendar( 'changeView', 'agendaDay' );
} else {
$('#calendar').fullCalendar( 'changeView', 'agendaWeek' );
}
}
});
});
它工作得很漂亮，让我可以让我的 Schedule.html.erb View 看起来干净漂亮。
<h1>Meetings</h1>
<div id='calendar'></div>
windowResize 回调用于解决另一个问题。更多信息请点击这里: How Can I get Adam Shaw's fullCalendar to display responsively in a rails 4 app
再次感谢您的帮助。
最佳答案
简短回答: TurboLink 预加载每个页面，因此不会触发就绪事件。相反，您甚至必须在 JavaScript 中添加“page:load”，如下所示:
CoffeeScript 解决方案:
$(document).on 'ready page:load', ->
// Your coffee script stuff
JQuery 解决方案:
$(document).on('ready page:load', function(){
// Your stuff
}
长答案: Turbolink 不关心 JQuery 就绪事件和添加新事件。 Here是 Turbolink 事件的列表。 Turbolink 预加载每个页面并且不会触发就绪事件。如果你有很多javascript，你可以使用this library在所有 JQuery 内容上添加“page:load”。
关于jquery - FullCalendar 仅在重新加载时出现，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/18261719/