Question

我将此网站http://eonasdan.github.io/bootstrap-datetimepicker/中的第一个示例复制并粘贴到我自己的html代码中。当我点击文本框旁边的图片时，它不会弹出日历供我选择

enter image description here

  <!DOCTYPE html>
    <html lang="en">
      <head>

        <link href="bootstrap/css/bootstrap.min.css" rel="stylesheet">
      </head>
    <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>
                $(function () {
                    $('#datetimepicker1').datetimepicker();
                });
            </script>
        </div>
    </div>
    </body>
    </html>

目录和最新代码，html代码位于LeaveDemo文件夹 enter image description here

我的bootstrap.min.js

enter image description here

我的bootstrap-datepicker.js enter image description here

错误

enter image description here

Answer 1

您没有包含任何js。要完成这项工作，您应该包括 bootstrap-datetimepicker.js 和 bootstrap.min.js

Answer 2

您似乎缺少Datepicker JavaScript库。

包含此内容并且您的日期选择器应该有效。

Answer 3

你是否使用Firebug？你有任何错误吗？您可能还必须包含jQuery库才能使用$（）函数。

Answer 4

您可以尝试以下代码。

非常基本的例子。

<!DOCTYPE html>
<html>
    <head>
        <title>Datepicker</title>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <!-- Bootstrap CSS and bootstrap datepicker CSS used for styling the demo pages-->
        <link rel="stylesheet" href="css/datepicker.css">
        <link rel="stylesheet" href="css/bootstrap.css">
    </head>
    <body>
        <div class="container">

                <input  type="text" placeholder="Click to show datepicker"  id="datetimepicker1">

        </div>
        <!-- Load jQuery and bootstrap datepicker scripts -->
        <script src="js/jquery-1.9.1.min.js"></script>
        <script src="js/bootstrap-datepicker.js"></script>
        <script type="text/javascript">
            // When the document is ready
            $(document).ready(function () {

                $('#example1').datepicker({
                    format: "dd/mm/yyyy"
                });  

            });
        </script>
    </body>
</html>

无法使datepicker引导程序正常工作

4 个答案: