Question

我正在使用##完整活动日历##，当用户点击日期时，模态框将出现并显示事件的详细信息。我使用下面的代码完整日历。任何帮助表示赞赏

 $(document).ready(function () { 
        var date = new Date();
        var d = date.getDate();
        var m = date.getMonth();
        var y = date.getFullYear();

        $('#calendar').fullCalendar({
            editable: true,
            events: [
                {
                    title: 'All Day Event',
                    start: new Date(y, m, 1),

                },
                {
                    title: 'Long Event',
                    start: new Date(y, m, d-5),
                    end: new Date(y, m, d-1)
                },
                {
                    id: 999,
                    title: 'Repeating Event',
                    start: new Date(y, m, d-3, 16, 0),
                    allDay: false
                },
                {
                    id: 999,
                    title: 'Repeating Event',
                    start: new Date(y, m, d+4, 16, 0),
                    allDay: false
                },
                {
                    title: 'Meeting',
                    start: new Date(y, m, d, 10, 30),
                    allDay: false
                }
            ]
        });


<div data-role="content">       
            <div id='calendar'></div>
        </div>

Answer 1

您可以使用dayClick处理程序，如

$(document).ready(function () {
    var date = new Date();
    var d = date.getDate();
    var m = date.getMonth();
    var y = date.getFullYear();

    $('#calendar').fullCalendar({
        editable: true,
        events: [{
            title: 'All Day Event',
            start: new Date(y, m, 1),

        }, {
            title: 'Long Event',
            start: new Date(y, m, d - 5),
            end: new Date(y, m, d - 1)
        }, {
            id: 999,
            title: 'Repeating Event',
            start: new Date(y, m, d - 3, 16, 0),
            allDay: false
        }, {
            id: 999,
            title: 'Repeating Event',
            start: new Date(y, m, d + 4, 16, 0),
            allDay: false
        }, {
            title: 'Meeting',
            start: new Date(y, m, d, 10, 30),
            allDay: false
        }],
        dayClick: function (obj, event) {
            console.log('a day has been clicked!');
            console.log(moment(obj._d).format('DD MMM YYYY'), obj._d);
            //add your code to show the modal for the day obj._d here
        }
    });
});

演示：Fiddle

使用jquery的事件日历

1 个答案: