「鏈接」兩個fullcalendars jQuery和動態改變彼此的日期

我在我的頁面有2個fullcalendars。一個是隻有一個月的小視圖，另一個是隻有一個星期和一天的視圖。目標是用戶從小的日期中選擇一個日期，並立即顯示在大日期中（周或日視圖）。用戶還可以使用大按鈕的prev和next按鈕進行導航，並且更改必須反映在小按鈕中。我使用兩個（我不知道這是否是最佳實踐）的原因是因爲我的每一天都有很多事件，所以缺少「+ x more」顯示事件選項，我必須找到一種方法來「解決「問題一天細胞增長很大。 Sο我有什麼是以下「鏈接」兩個fullcalendars jQuery和動態改變彼此的日期

HTML

<div id="small-cal"></div> 
<div id="calendar"></div>

$(document).ready(function(){ 
    $("#calendar").fullCalendar({ 
     ...some options here 


    }); 
    $("#small-cal").fullCalendar({ 
     ...some options here 
     dayClick:function(date,allDay){ 
      if (allDay){ 
       $("#calendar").fullCalendar('gotoDate', date); //Works big calendar goes to date in the view that is currently in. 
      } 
     } 

    }); 
    $("#calendar .fc-button-next span).click(function(){ 
     //catching next clicked from big calendar 
     var date = $("#calendar").fullCalendar('getDate'); 
     $("#small-cal").fullCalendar('gotoDate', date); //Not working properly 

    }); 
});

不工作的原因是因爲點擊來自新的日期是在大日曆呈現，這樣的日期變量之前包含今天的日期而不是明天的日期。我知道有一種方法incrementDay，但無法使用它。我可以在我的日期對象中添加1以使其進入下一頁嗎？

編輯解決它使用此：

$('#calendar .fc-button-next span').click(function(){ 
      var date = $("#calendar").fullCalendar('getDate'); 
      date.setDate(date.getDate() + 1); 
      console.log(date); 
      $("#small-cal").fullCalendar('gotoDate', date); 
     }); 

    $('#calendar .fc-button-prev span').click(function(){ 
     var date = $("#calendar").fullCalendar('getDate'); 
     date.setDate(date.getDate() - 1); 
     console.log(date); 
     $("#small-cal").fullCalendar('gotoDate', date); 
    });

但現在我得到另一個「錯誤」。如果我反覆按下按鈕非常快，它不會改變日期。它甚至不會登錄控制檯。像大量點擊一樣滯後。我該如何克服這個問題？這是一個普通的javascript問題嗎？

來源

2013-11-27 Apostolos

嘗試使用onclick事件中的setimeout函數，當我想要使用滾動瀏覽月份以防止指向服務器的指數調用時，我已經完成了此操作。 –

用什麼參數。我的意思是多少時間？ – Apostolos

你是什麼意思？ [settimeout]（http://www.w3schools.com/jsref/met_win_settimeout.asp） –

我有同樣的問題。最好的解決辦法是創建自己的按鈕，並把它掛到像這樣所有日曆：（你可以在文檔中找到）

$('#my-prev-button').click(function() { 
    $('#calendar').fullCalendar('prev'); 
    $('#small-cal').fullCalendar('prev'); 

}); 
$('#my-next-button').click(function() { 
    $('#calendar').fullCalendar('next'); 
    $('#small-cal').fullCalendar('next'); 

}); 

<div id='my-prev-button'>Previous Week</div> 
<div id='my-next-button'>Next Week</div>

你會那麼顯然有隱藏默認按鈕

來源

2014-03-25 16:38:10

「鏈接」兩個fullcalendars jQuery和動態改變彼此的日期

回答

相關問題