首页 > 解决方案 > Mozilla Firefox 的完整日历多事件事件问题

问题描述

我的全日历有问题,但仅限于 Mozilla Firefox 浏览器。我想添加 2 个事件:第一个在 17.07 到 20.07 日期,另一个在 18.07 到 22.07。我的浏览器结果显示我在日期 17.07 的第一个事件没有结束日期和第二个正确的结果。我不知道为什么:/ 在其他浏览器(chrome,opera)中它看起来更好。

$('.calendar').fullCalendar({
        header: {
            right: '',
            center: '',
            left: ''
        },
        firstDay: 1,
        buttonIcons: {
            prev: 'calendar__prev',
            next: 'calendar__next'
        },
        theme: false,
        selectable: true,
        selectHelper: true,
        editable: false,
        events: [

        ],

        viewRender: function (view) {
            var calendarDate = $('.calendar').fullCalendar('getDate');
            var calendarMonth = calendarDate.month();

            //Set data attribute for header. This is used to switch header images using css
            $('.calendar .fc-toolbar').attr('data-calendar-month', calendarMonth);

            //Set title in page header
            $('.content__title--calendar > h1').html(view.title);
        },

        eventClick: function (event, element) {
            $('#edit-event input[value='+event.className+']').prop('checked', true);
            $('#edit-event').modal('show');
            $('.edit-event__id').val(event.id);
            $('.title').val(event.title);
            $('.description').val(event.description);
            $('.start_date').val(event.start);
            $('.stop_date').val(event.stop);
            $('.user_full_name').val(event.author);

        },
        eventRender: function(event, element) {
            startDate=event.start.toISOString().substring(0, 10);
            stopDate=event.stop.substring(0, 10);
            title = event.title + "<br />"+' [ '+startDate+' ]'  + ' [ '+stopDate+' ] ';
            element.popover({
              title: title,
              trigger: 'hover',
              placement: 'auto',
              container: 'body',
              html: true
            });
        }
    });

我从 api 获取数据并在该函数上对其进行编辑。

function getApiData(daysInMonth){
    var api_url = $('input[name="apiUrl"]').val();
    api_url = api_url+'/api/eventStart='+y+'-'+m+'-'+'01'+'&eventStop='+y+'-'+m+'-'+daysInMonth;

    $.getJSON(api_url,function(result){

        $.each(result.data,function(key,index){
            bg = event_color(index.category_name)
            if(index.category_name == "Holiday"){
                title = index.category_name+' - '+index.user_name;

                endDate=index.event_stop.substring(0, 10);
                endTime=index.event_stop.substring(10, 19);

                var datePlus1 = endDate.split('-');
                datePlus1[2] = Number(datePlus1[2])+1;

                if(datePlus1[2] > daysInMonth){
                    datePlus1[2] = '01';
                    datePlus1[1] = Number(datePlus1[1])+1;  

                    if(datePlus1[1]<10){
                        end=datePlus1[0]+'-0'+datePlus1[1]+'-'+datePlus1[2];
                    }
                    else{
                        end=datePlus1[0]+'-'+datePlus1[1]+'-'+datePlus1[2];
                    }
                }
                else{
                    end=datePlus1[0]+'-'+datePlus1[1]+'-'+datePlus1[2];
                }

                $('.calendar').fullCalendar('renderEvent', {
                    id: index.id,
                    title: title,
                    start: index.event_start,
                    end: end,
                    stop: index.event_stop,
                    description:index.event_description,
                    author: index.user_full_name,
                    allDay: true,
                    className: bg,
                }, true);
            }
         }
      }

`

标签: javascriptfullcalendar

解决方案


好的,我解决了这个问题。如果天数 < 10,函数必须将“0”添加到值天,因为日期看起来像这样 2019-11-1 而不是 2019-11-01。


推荐阅读