如何在日历中添加日程元素

How to add schedule elements into this calendar?

本文关键字：程元素 元素 添加 日历      更新时间：2023-09-26

我希望这个问题缺乏细节不会导致它被标记为格式不好，但我一直在玩这个相互依赖的css/js/jquery日历/日程脚本，我似乎找不到如何添加，说，在特定日期的提醒。我有一个数据库，我需要做的事情和他们必须完成的日期，我可以单独访问每个日期元素(d/m/y)，我想知道如何实际实现我的数据库到这个日历。

这是html

<!-- HTML -->
<!DOCTYPE html>
<html>
    <head>
        <title>Calendar</title>
        <!-- CSS -->
        <link href="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.0/css/bootstrap-combined.min.css" rel="stylesheet" />
        <link href="//arshaw.com/js/fullcalendar-1.5.3/fullcalendar/fullcalendar.css" rel="stylesheet" />
        <link href="http://arshaw.com/js/fullcalendar-1.5.3/fullcalendar/fullcalendar.print.css" rel="stylesheet" />
        <!-- SCRIPTS -->
        <script class="cssdesk" src="//ajax.googleapis.com/ajax/libs/jquery/1.8.0/jquery.min.js" type="text/javascript"></script>
        <script class="cssdesk" src="//ajax.googleapis.com/ajax/libs/jqueryui/1.8.23/jquery-ui.min.js" type="text/javascript"></script>
        <script class="cssdesk" src="//netdna.bootstrapcdn.com/twitter-bootstrap/2.1.0/js/bootstrap.min.js" type="text/javascript"></script>
        <script class="cssdesk" src="//arshaw.com/js/fullcalendar-1.5.3/fullcalendar/fullcalendar.min.js" type="text/javascript"></script>
    </head>
    <body>
        <div class="container">
            <h1>Date</h1>
            <div id='calendar'></div>
        </div>
    </body>
</html>

在代码中没有任何地方表明我可以添加事件的div，我希望有人可以帮助。

提前感谢。

你应该在http://fullcalendar.io查看日历插件文档

包含日期修改javascript ..这段代码摘自主页上的示例。

$(function() {
$('#calendar').fullCalendar({
    header: {
        left: 'prev,next today',
        center: 'title',
        right: 'month,agendaWeek,agendaDay'
    },
    defaultDate: '2015-02-12',
    editable: true,
    eventLimit: true, // allow "more" link when too many events
    events: [
        {
            title: 'All Day Event',
            start: '2015-02-01'
        },
        {
            title: 'Long Event',
            start: '2015-02-07',
            end: '2015-02-10'
        },
        {
            id: 999,
            title: 'Repeating Event',
            start: '2015-02-09T16:00:00'
        },
        {
            id: 999,
            title: 'Repeating Event',
            start: '2015-02-16T16:00:00'
        },
        {
            title: 'Conference',
            start: '2015-02-11',
            end: '2015-02-13'
        },
        {
            title: 'Meeting',
            start: '2015-02-12T10:30:00',
            end: '2015-02-12T12:30:00'
        },
        {
            title: 'Lunch',
            start: '2015-02-12T12:00:00'
        },
        {
            title: 'Meeting',
            start: '2015-02-12T14:30:00'
        },
        {
            title: 'Happy Hour',
            start: '2015-02-12T17:30:00'
        },
        {
            title: 'Dinner',
            start: '2015-02-12T20:00:00'
        },
        {
            title: 'Birthday Party',
            start: '2015-02-13T07:00:00'
        },
        {
            title: 'Click for Google',
            url: 'http://google.com/',
            start: '2015-02-28'
        }
    ]
  });
});
相关文章：