Datetimepicker仅显示选择器功能的某些部分

Question

我正在尝试使here的datetimepicker正常工作

我使用Bower安装了此软件包，并链接了所有样式表/ js文件。

当我访问页面时，我只能看到实际日期选择器的某些部分。 以下是一些具有更好外观的图片：

我的链接：

<!-- Scripts -->
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script>
<script src="{{ asset('js/jquery.min.js') }}" defer></script>
<script src="{{ asset('tether/dist/js/tether.min.js') }}" defer></script>
<script src="{{ asset('js/moment.min.js') }}" defer></script>
<script src="{{ asset('js/app.js') }}" defer></script>
<script src="{{ asset('js/bootstrap-datetimepicker.min.js') }}" defer></script>
<script src="{{ asset('js/bootstrap.min.js') }}" defer></script>

<!-- Styles -->

<link href="{{ asset('css/bootstrap.min.css') }}" rel="stylesheet">
<link href="{{ asset('css/bootstrap-datetimepicker.min.css') }}" rel="stylesheet">

<link href="{{ asset('css/app.css') }}" rel="stylesheet">
<link href="{{ asset('css/style.css') }}" rel="stylesheet">

我的HTML：

@extends ('layouts.app')

@section ('content')
<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 type="text/javascript">
            $(function () {
                $('#datetimepicker1').datetimepicker();
            });
        </script>
    </div>
@endsection

我在这里想念什么？

Answer 1

尝试指定格式：

$('#datetimepicker1').datetimepicker({
    format: 'MM/dd/YYYY'
});

根据文档，在选项中指定的格式定义了显示哪些组件。