0

我是一个完整的新手，一直在努力成功实施Bootstrap Datepicker。

我得到的只是具有“12-02-2013”​​值的输入字段；一旦我单击该字段，就没有下拉列表。我已经在 stackoverflow 和其他地方查看了其他示例，但我还没有找到答案。

<!doctype html>
<html>
<head>
<meta charset="UTF-8">
<script src="js/bootstrap-datepicker.js"></script>
<script src="js/bootstrap-datepicker.es.js"></script>
<link rel="stylesheet" type="text/css" href="css/datepicker.css">
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap-combined.min.css" rel="stylesheet">
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<title>Datepicker</title>
</head>

<body>

<div class="input-append date" id="dp3" data-date-format="dd-mm-yyyy">
    <input class="span2" size="16" type="text" value="12-02-2013" readonly><span class="add-on"><i class="icon-th"></i></span>
</div>   

    <script>
        $('#dp3').datepicker();
    </script>

</body>
</html>
4

1 回答 1

3

检查脚本的顺序，bootstrap.js应该在之后jQuery.js library

<link rel="stylesheet" type="text/css" href="css/datepicker.css" />
<link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/css/bootstrap- combined.min.css" rel="stylesheet" />
<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.2/js/bootstrap.min.js"></script>
<script src="js/bootstrap-datepicker.js"></script>
<script src="js/bootstrap-datepicker.es.js"></script>

另外，如果您想要datepickerfor textbox，那么

从 div 中删除 id 并将其添加到输入标签

<div class="input-append date"  data-date-format="dd-mm-yyyy">
    <input class="span2" id="dp3" size="16" type="text" value="12-02-2013" readonly><span class="add-on"><i class="icon-th"></i></span>
</div> 


$('#dp3').datepicker();
<link href="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/css/datepicker3.css" rel="stylesheet" />
<link href="http://netdna.bootstrapcdn.com/bootstrap/3.0.3/css/bootstrap.min.css" rel="stylesheet" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="http://eternicode.github.io/bootstrap-datepicker/bootstrap-datepicker/js/bootstrap-datepicker.js"></script>
<div class="input-append date" data-date-format="dd-mm-yyyy">
  <input class="span2" id="dp3" size="16" type="text" value="12-02-2013" readonly><span class="add-on"><i class="icon-th"></i></span>
</div>

于 2013-09-05T19:19:30.970 回答