无法使引导日期选择器工作

Cannot get bootstrap datepicker to work

本文关键字：日期 选择器 工作      更新时间：2023-09-26

我一直试图让日期picker为Bootstrap工作，但一直没有成功。数据采集框从未显示:

<head>
    <title>Pick-a-Date</title>
    <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <link rel="stylesheet" href="css/bootstrap.min.css">
    <link rel="stylesheet" href="css/bootstrap-theme.min.css">
    <link rel="stylesheet" href="css/datepicker.css">
    <script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>
    <script src="js/bootstrap.min.js" type="text/javascript"></script>
    <script src="js/bootstrap-datepicker.js" type="text/javascript"></script>
</head>
<body>
<div class="container">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">Select date</h3>
        </div>
        <div class="panel-body">
            <div class="input-append date" id="datepick" data-date="<?=date('m-d-Y', strtotime('-25 hours')) ?>" data-date-format="dd-mm-yyyy">
                <input class="span2" size="16" type="text" value="<?=date('m-d-Y', strtotime('-25 hours')) ?>">
                <span class="add-on"><i class="icon-calendar"></i></span>
            </div>
        </div>
    </div>
</div>
<script type="text/javascript">
    $(function() {
        $('#datepick').datepicker({
            format: "yyyy/mm/dd",
            autoclose: true,
            todayHighlight: true
        });
    });
</script>
</body>

这是小提琴:http://jsfiddle.net/eComEvo/7svU3/2/

你知道怎么回事吗?

如果你把bootstrap datepicker的引用改为可以解析的东西，例如//cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.3.0/js/bootstrap-datepicker.js，它可以工作。

http://jsfiddle.net/eComEvo/7svU3/2/

<div class="container">
    <div class="panel panel-default">
        <div class="panel-heading">
            <h3 class="panel-title">Select date</h3>
        </div>
        <div class="panel-body">
            <div class="input-append date" id="datepick" data-date="22-05-2014" data-date-format="dd-mm-yyyy">
                <input class="span2" size="16" type="text" value="22-05-2014">
                <span class="add-on"><i class="icon-calendar"></i></span>
            </div>
        </div>
    </div>
</div>
$(function() {
    $('#datepick').datepicker({
        format: "yyyy/mm/dd",
        autoclose: true,
        todayHighlight: true
    });
});
相关文章：