0

我正在尝试使用Bootstrap 日期时间选择器：

我相信遵循了所有的指示，但我无法让它工作。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>
4

3 回答 3

0

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'给inputbox 而不是div*

查看工作中的 JSFiddle

于 2014-11-19T07:08:53.317 回答
0

在您的小提琴中，您没有引用该jQuery库。

它适用于这个更新的小提琴

于 2014-11-19T07:09:16.770 回答
0

检查我更新的小提琴

您有 2 个问题：

1-缺少jQuery库
2- jsfiddle 的divResult与日期范围选择器按钮重叠，所以我添加了测试边距：

<div class='input-group date' id='datetimepicker1' style="margin-top: 100px;">
于 2014-11-19T07:33:19.790 回答