Bootstrap日历设置

时间:2014-02-07 01:14:14

标签: twitter-bootstrap-3

西洛!

我想提前感谢您的支持。

我正在尝试使用this html and css在bootstrap中制作日历。我遇到了很多麻烦,按照文档后我最后得到一个空白页面。这是我的代码:

<!DOCTYPE html>
<html>
<head>
    <title>WR | Calender</title>
    <link rel="stylesheet" href="components/bootstrap2/css/bootstrap.css">
    <link rel="stylesheet" href="components/bootstrap2/css/bootstrap-responsive.css">
</head>
<body>

    <div id="calendar"></div>

    <script type="text/javascript" src="components/jquery/jquery.min.js"></script>
    <script type="text/javascript" src="components/underscore/underscore-min.js"></script>
    <script type="text/javascript" src="components/bootstrap2/js/bootstrap.min.js"></script>
    <script type="text/javascript" src="components/jstimezonedetect/jstz.min.js"></script>
    <script type="text/javascript">
        var calendar = $('#calendar').calendar({
        events_source: [
            {
                "id": 293,
                "title": "Event 1",
                "url": "http://example.com",
                "class": "event-important",
                "start": 12039485678000, // Milliseconds
                "end": 1234576967000 // Milliseconds
            }
        ]});
    </script>
</body>
</html>

1 个答案:

答案 0 :(得分:1)

您缺少“calendar.js”,“calendar.css”。

 <link rel="stylesheet" href="css/calendar.css">
 <script type="text/javascript" src="js/calendar.js"></script>

我真的建议你在标题部分添加每个javascript文件和CSS文件。