0

特定の日の背景色を設定しようとしています。これが機能することがわかりました：

$('.fc-day15').css('backgroundColor','black');

しかし、色は日ではなくグリッドの 16 番目にあります。月の 1 日がどこであるかの最初の週のオフセットがわかっていれば、数字を追加するだけで済みます。

編集:

私はこれがうまくいくことを発見しました：

                    var TheActualDay=15;
                    var DayOffset=($('#calendar').fullCalendar('getView').start.getTime()-$('#calendar').fullCalendar('getView').visStart.getTime())/(1000 * 60 * 60 * 24);
                    var DayNumber=(TheActualDay-1)+DayOffset;
                    $('.fc-day'+DayNumber.toString()).css('backgroundColor','black');

しかし、もっと短縮された解決策はありますか?

4

3 に答える 3

1

これは可能な解決策です。viewDisplayイベントを宣言します。

        viewDisplay: function(view) {
            if (view.name == 'month'){ //just in month view mode 
                var d = view.calendar.getDate(); //choise the date for cell customize
                var cell = view.dateCell(d); //get the cell location for date
                var bodyCells = view.element.find('tbody').find('td');//get all cells from current calendar
                var _element = bodyCells[cell.row*view.getColCnt() + cell.col]; //get specific cell for the date
                $(_element).css('background-color', '#FAA732'); //customize the cell
            }
        }
于 2013-03-15T11:56:04.080 に答える
0 
eventRender: function (event, element, view) {          
        // like that
        var dateString = $.fullCalendar.formatDate(event.start, 'yyyy-MM-dd');
        view.element.find('.fc-day[data-date="' + dateString + '"]').css('background-color', '#FAA732');

        // or that
        var cell = view.dateToCell(event.start);
        view.element.find('tr:eq(' + (cell.row + 1) + ') td:eq(' + cell.col + ')').css('background-color', '#FAA732');
    }

より良い解決策はありますか？

于 2013-10-01T08:03:43.160 に答える
0

Erik Vargas さん、例をありがとうございます。コードを簡単に変更して、初日と最終日が異なる色になるようにしました。

viewDisplay: function(view) {  

                    if (view.name == 'month')
                    { //just in month view mode 
                        var start_date = view.start; // this is the first day of the current month ( you can see documentation in Fullcalender web page )
                        var last_date = view.end; // this is actually the 1st day of the next month ( you can see documentation in Fullcalender web page )                          
                        //var d = view.calendar.getDate(); //choise the date for cell customize                         
                        var start_cell = view.dateCell(start_date); //get the cell location for date
                        var last_cell = view.dateCell(last_date); //get the cell location for date                   
                        var bodyCells = view.element.find('tbody').find('td');//get all cells from current calendar                                                       
                        var _element_firstday = bodyCells[start_cell.row*view.getColCnt() + start_cell.col]; //get specific cell for the date
                        var _element_lastday = bodyCells[last_cell.row*view.getColCnt() + last_cell.col]; //get specific cell for the date
                        //alert(start_cell.row*view.getColCnt() + start_cell.col);

                        $(_element_firstday).css('background-color', 'black'); //customize the cell #40ACC8
                        $(_element_lastday).css('background-color', 'blue'); //customize the cell #40ACC8
                    }                   

        },
于 2013-05-09T08:56:46.600 に答える