Bootstrap DateTimePicker無法正常工作

Question

我相信已按照所有說明進行操作，但無法正常工作。 Firebug沒有給我任何錯誤，並且我多次檢查了所有文件路徑。 我究竟做錯了什么？

（我實際上在這里找到了相同的問題，未得到解答：無法使datepicker引導程序正常工作）

這是我的JSfiddle

這是我的代碼：

<html>
    <head>
        <title>date test</title>
        <link href="css/bootstrap.min.css" rel="stylesheet"/>
        <link rel="stylesheet" href="bootstrap-datetimepicker.min.css"/>
    </head>
    <body>
        <div class="container">
            <div class="row">
                <div class='col-sm-6'>
                    <div class="form-group">
                        <div class='input-group date' id='datetimepicker1'>
                            <input type='text' class="form-control" />
                            <span class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                            </span>
                        </div>
                    </div>
                </div>
                <script type="text/javascript">
            $(function () {
                $('#datetimepicker1').datetimepicker();
            });
        </script>
            </div>
        </div>    
            <script type="text/javascript" src="jquery.js"></script>
            <script type="text/javascript" src="moment.js"></script>
            <script type="text/javascript" src="transition.js"></script>
            <script type="text/javascript" src="collapse.js"></script>
            <script type="text/javascript" src="bootstrap.min.js"></script>
            <script type="text/javascript" src="bootstrap-datetimepicker.min.js"></script>
    </body>
</html>

Answer 1

JS

$(function () {
     $('.datetimepicker1').datetimepicker();
});

的HTML

<div class="container">
            <div class="row">
                <div class='col-sm-6'>
                    <div class="form-group">
                        <div class='datetimepicker1 input-group date'>
                            <input  type='text' class="datetimepicker1 form-control" />
                            <span id='' class="input-group-addon"><span class="glyphicon glyphicon-calendar"></span>
                            </span>
                        </div>
                    </div>
                </div>

注：*我刪除collapse.js在的jsfiddle外部資源，有人拋出一些語法錯誤，而你加載jquery library 2.1最后，我做出了修正，分配id='datetimepicker1'到input框，而不是div *

查看工作的JSFiddle

Answer 2

在您的小提琴中，您沒有引用jQuery庫。

它適用於此更新的小提琴

Answer 3

檢查我更新的小提琴

您有2個問題：

1-缺少jQuery庫
2- jsfiddle的 div Result與daterange選擇器按鈕重疊，因此我增加了測試余量：

<div class='input-group date' id='datetimepicker1' style="margin-top: 100px;">

Bootstrap DateTimePicker無法正常工作

問題描述

3 個解決方案

解決方案1
0 2014-11-19 07:08:53

解決方案2
0 2014-11-19 07:09:16

解決方案3
0 已采納 2014-11-19 07:33:19

Bootstrap DateTimePicker無法正常工作

問題描述

3 個解決方案

解決方案1 0 2014-11-19 07:08:53

解決方案2 0 2014-11-19 07:09:16

解決方案3 0 已采納 2014-11-19 07:33:19

解決方案1
0 2014-11-19 07:08:53

解決方案2
0 2014-11-19 07:09:16

解決方案3
0 已采納 2014-11-19 07:33:19