bootstrap datepicker沙盒容器给出空白div

Question

我使用bootstrap datepicker但是当我点击输入时，它给了我一个像这样的空白div

其中是一个片段：

＆＃13;

＆＃13;

$('#sandbox-container input').datepicker({
  format: "yyyy-mm-dd",
  weekStart: 1,
  autoclose: true,
  todayHighlight: true
});

＆＃13;

<script src="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/js/bootstrap.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/js/bootstrap-datepicker.js"></script>
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-beta/css/bootstrap.min.css">
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.7.1/css/bootstrap-datepicker.css">

<div class="col-md-12">
  <h4>Date Range:</h4>
  <div class='col-sm-4' id="sandbox-container">
    From:
    <input type="text" id="fromdate" style="padding-left: 40px;"><span style="right: 200px; top: 0px; border-right: 1px solid #ccc; padding-right: 8px;" class="glyphicon glyphicon-calendar fa fa-calendar" aria-hidden="true"></span>
  </div>
  <div class='col-sm-4' id="sandbox-container">
    To:
    <input type="text" id="todate" style="padding-left: 40px;"><span style="right: 200px; top: 0px; border-right: 1px solid #ccc; padding-right: 8px;" class="glyphicon glyphicon-calendar fa fa-calendar" aria-hidden="true"></span>
  </div>
</div>

<div class="clearfix"></div>

＆＃13;

＆＃13;

＆＃13;

它在片段中运行得很好!!!!但在我的项目中没有工作!!!!