如何在 HTML 示例中实现 bootstrap-datepicker 沙箱

Question

我在下面的链接中找到了 bootstrap 的日期选择器，好吧，我下载了开发版本，然后在那里的页面上配置了一些设置，并附加了所需的样式表和 javascript 文件后，我仍然不能让 HTML 示例正常工作。

这是要下载的示例的link。

我收集了所需的 CSS 和 JS 如下：

  <link href="css/bootstrap.css" rel="stylesheet" type="text/css">
  <link href="build/build_standalone.less.css" rel="stylesheet" type="text/css">
  <link href="css/datepicker.css" rel="stylesheet" type="text/css">


  <script type="text/javascript" src="js/bootstrap.js"></script>
  <script type="text/javascript" src="js/jquery-1.11.2.min.js"></script>
  <script type="text/javascript" src="js/bootstrap-datepicker.js"></script>

HTML 如下：

    <div class="input-daterange input-group" id="datepicker">
        <input type="text" class="input-sm form-control" name="start" />
        <span class="input-group-addon">to</span>
        <input type="text" class="input-sm form-control" name="end" />
    </div>

文件末尾的JS脚本如下：

    <script>

      $('#sandbox-container .input-daterange').datepicker({
         startDate: "-12/30/2014",
         endDate: "+01/15/2015",
         startView: 1,
         clearBtn: true,
         calendarWeeks: true,
         autoclose: true,
         todayHighlight: true
       });
  </script>

现在两个输入出现了，但它们不起作用，我不知道缺少什么。我在演示的下载文件中也找不到任何 HTML 示例，都是 .md、.jason 和其他格式，它似乎是原始的，我实际上不知道如何在 HTML 文件中简单地实现它。

Answer 1

我在您的 HTML 中没有看到 #sandbox-container：

<div id="sandbox-container">        
    <div class="input-daterange input-group" id="datepicker">
        <input type="text" class="input-sm form-control" name="start" />
        <span class="input-group-addon">to</span>
        <input type="text" class="input-sm form-control" name="end" />
    </div>
</div>