調用fullcalendar方法/從另一個文件回調

Question

我有幾個問題實現我的fullCalendar示例，因爲我是javascript，jquery和fullcalendar本身的noob。 簡短摘要： 我的項目結構是索引html，它獲取我需要的js庫，並且只有一個包含fullcalendar的div，一個calendar.js文件，我保留fullcalendar配置，並從外部源獲取事件和localstorage，最後是一個events.js文件，我通過選擇時間塊並將它們存儲到本地存儲來實現事件創建。這些文件應該像這樣分開，以保持選項的代碼和選擇和存儲的代碼分離，組織和清潔。 此外，谷歌日曆事件也意味着成爲本地存儲的備用事件源。

因此，這裏是我的編號問題：

1. 從events.js的選擇回調不工作，如果它是在（我曾與$（文件）。就緒（）也試過 ）該單獨的文件 （雖然它只包含在一個工作正常，如預期）。 如何成功調用此方法？
2. 如何在頁面加載時立即從localstorage.getItem（）渲染事件？ （這也意味着稍後分開）
3. 爲什麼我的localstorage.getItem（）在calendar.js中獲取 項目重複存儲3次？ （這一次是真的煩我了）

編輯：解決我自己的幾個問題（但之後的第一個評論的建議）： 我現在該怎麼站：

1. 事件現在創建成功的選擇代碼 與主calendar.js文件從events.js分開

2. 我仍然需要呈現事件從localStorage whe n中的頁面加載（而不是從單獨的文件，因爲我在做什麼，傻 鵝）

3. 的localStorage.getItem（）不再重複存儲的事件3次......我需要一個數組，我傻再次。

更新的代碼： 這裏是我的calendar.js

$(document).ready(function() { 
    calendar = $("#calendar").fullCalendar({ 
     editable: true, 
     selectable: true, 
     selectHelper: true, 
     //Retrieves the function that allows events to be created by selecting cells on the calendar 
     select: eventCreaterOnSelection 
    }); 
}); 

這裏的代碼是我更新的events.js代碼：

eventCreaterOnSelection = function(start, end, allDay) { 
     // After selection user will be promted to renter the title for the event and if it is an all day event. 
     var title = prompt("Event Title:"); //Setting the title for the event 
     var allDay; 
     //This is an array to store the event attributes 
     var save = []; 
     //If the user inputs a title then the event will be saved otherwise nothing will occur 
     if (title) { 
      //First we check and store if it is an all day event 
      allDay = confirm("All Day event?"); 
      //Create the event object with a method to store it in Local Storage 
      var newEvent = { 
       title: title, 
       start: start, 
       end: end, 
       allDay: allDay, 
       //Define Local storage storing and making it readable (stringify for JSON) 
       save: localStorage.setItem(title, JSON.stringify({ 
        "title": title, 
        "start": start, 
        "end": end, 
        "allDay": allDay 
       })) 
      }; 
      //Render the event object and make it "stick" 
      calendar.fullCalendar("renderEvent", newEvent, true); 
     } 
     //Remove the selection on exiting the event creation 
     calendar.fullCalendar("unselect"); 
     //Get the events from storage 
     var storedEvents = []; 
     for (title in localStorage) { 
      storedEvents = localStorage.getItem(title); 
      //(testing only. getItem is now successful. To now render on the document this code must go to calendar.js) 
      console.log(storedEvents); 
     } 
    } 

Answer 1

從功能提升了storedEvents解決（也分開到另一個函數，而在另一個文件）：

我fullcalendar.js代碼：

$(document).ready(function() { 
    calendar = $("#calendar").fullCalendar({ 
     //... 
     eventSources: [ 
      { 
       //source1 a google calendar url 
      }, 
      { 
       events: localStorageEventFetcher() 
      } 
     ], 
     select: eventCreaterOnSelection 
     //... 
    }); 
}); 

我eventCreatorOnSelection.js：

eventCreaterOnSelection = function(start, end, allDay) { 
    var title = prompt("Event Title:"); 
    var allDay; 
    var save = []; 
    if (title) { 
     allDay = confirm("All Day event?"); 
     var newEvent = { 
      title: title, 
      start: start, 
      end: end, 
      allDay: allDay, 
     }; 
     save.push(localStorage.setItem(title, JSON.stringify(newEvent))); 
     calendar.fullCalendar("renderEvent", newEvent, true); 
    } 
    calendar.fullCalendar("unselect"); 
} 

我的新localStorageEventFetcher.js文件：

localStorageEventFetcher = function(title) { 
    var storedEvents = []; 
    for (title in localStorage) { 
     storedEvents.push(JSON.parse(localStorage.getItem(title))); 
    }  
    return storedEvents; 
} 

Answer 2

1. 你正在初始化日曆兩次（基本上無論哪一個被稱爲2nd是唯一的日曆ar創建）。如果你想分離你的事件代碼，只需從events.js中的方法返回一個具有適當值的對象（或者我想你可以在全局範圍內創建變量），那麼你需要將它與事件您在日曆中使用的對象。js（看看jQuery的函數合併或擴展爲此，我不記得哪一個會更合適）

2. 不知道是什麼問題。什麼是本地存儲？它與你的谷歌日曆事件有什麼關係？您應該使用eventSources，因爲這樣可以指定多個來源。

3. eventRender爲每個事件運行。我會假設有從你的電話到谷歌日曆返回3個事件，然後運行eventRender對於這些，這會導致你的3個電話