如何在HTML页面中放置datetimepicker？

Question

我的网站标题中都包含所有这些文件：

<script src="https://code.jquery.com/jquery-3.3.1.js" integrity="sha256-2Kok7MbOyxpgUVvAk/HJ2jigOSYS2auK4Pfzbm7uH60=" crossorigin="anonymous"></script>
<script src="https://code.jquery.com/ui/1.12.1/jquery-ui.js" integrity="sha256-T0Vest3yCU7pafRw9r+settMBX6JkKN06dqBnpQ8d30="crossorigin="anonymous"></script>
<script src="http://localhost:8080/Javascript/bootstrap.bundle.js" type="javascript/text"></script>
<link rel="stylesheet" href="http://localhost:8080/Css/bootstrap.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/css/bootstrap-datepicker.css"/>
<script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datepicker/1.8.0/js/bootstrap-datepicker.js" type="javascript/text"></script>

然后我的体内有以下东西：

<div class="container-fluid">
    <div class="row">
        <div class="col-md-6 col-sm-6 col-xs-12">

            <!-- Form code begins -->
            <form method="post">
                <div class="form-group"> <!-- Date input -->
                    <label class="control-label" for="date">Date</label>
                    <input class="form-control" id="date" name="date" placeholder="MM/DD/YYY" type="text"/>
                </div>
                <div class="form-group"> <!-- Submit button -->
                    <button class="btn btn-primary " name="submit" type="submit">Submit</button>
                </div>
            </form>
            <!-- Form code ends --> 
        </div>
    </div>    
</div>

<script>
    $(document).ready(function(){
        $("#date").datepicker();
    });
</script>

我希望它看起来像这样：https://formden.com/blog/date-picker。

但是它看起来像这样：

我该怎么办？我已经尝试了几个小时。我尝试了文件的不同排序。当我尝试做datetimepicker()时。我得到一个错误。我只是不知道该怎么办，请帮忙。

Answer 1

看起来您正在使用JqueryUI以及BootstrapDatepicker。由于bootstrapDatepicker和JqueryUI都为初始化的日期选择器获得了相同的函数名，因此存在歧义。 现在，您的标记已首先加载了jqueryUI js，因此理想情况下，它是使用jqueryUI datepicker函数并期望可以找到here的jqueryUI的CSS。

如果要使用引导日期选择器，则可能需要删除jqueryUI.js或生成不包括日期选择器功能的jqueryUI js。