如何在Bootstrap-DateTimePicker中啟用日期和時間選擇器

Question

我正在使用最新版本的4.17.47的Bootstrap-DateTimePicker 。

我閱讀了所有文檔選項，功能和事件。

我還包括了JS和CSS的所有依賴項。

但是某種方式無法正常工作。

<!doctype html>
<html lang="en">

<head>
    <script type="text/javascript" src="./jquery.min.js"></script>
    <script type="text/javascript" src="./moment.js"></script>
    <script type="text/javascript" src="./bootstrap.min.js"></script>
    <script type="text/javascript" src="./bootstrap-datetimepicker.min.js"></script>
    <link rel="stylesheet" href="./bootstrap.min.css" />
    <link rel="stylesheet" href="./bootstrap-datetimepicker.min.css" />
</head>

<body>
    <div class="container">
        <div class="row">
            <div class='col-sm-6'>
                <input type='text' class="form-control" id='datetimepicker4' />
            </div>
            <script type="text/javascript">
                $(function () {
                    $('#datetimepicker4').datetimepicker({
                        format: 'DD/MM/YYYY hh:mm',
                    });
                });
            </script>
        </div>
    </div>
</body>

</html>

文檔中有一個格式選項，用於顯示日歷部分或時間選擇器部分。

我要顯示的是日歷和時間選擇器這兩個部分。

但是當我設置format: 'DD/MM/YYYY'它會正確顯示日歷部分。

當我設置format: 'hh:mm'它可以正確顯示時間選擇器。

但是，當我設置format:'DD/MM/YYYY hh:mm'來啟用這兩個部分時，它不顯示日歷部分，而僅顯示時間選擇器圖標，當我單擊該圖標時，它將打開時間選擇器。 如果我未明確設置format選項並將其默認設置為false，則情況相同。

我做錯了什么嗎？

Answer 1

目前，Bootstrap-DateTimePicker 不支持Bootstrap 4 。 實際上，您的代碼在Bootstrap 3中看起來不錯。

 <!doctype html> <html lang="en"> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.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/moment.js/2.13.0/moment.js"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script> <link href="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/css/bootstrap-datetimepicker.min.css" rel="stylesheet"/> <script src="https://cdnjs.cloudflare.com/ajax/libs/bootstrap-datetimepicker/4.17.37/js/bootstrap-datetimepicker.min.js"></script> </head> <body> <div class="container"> <div class="row"> <div class='col-sm-6'> <input type='text' class="form-control" id='datetimepicker4' /> </div> <script type="text/javascript"> $(function () { $('#datetimepicker4').datetimepicker({ format: 'DD/MM/YYYY hh:mm', }); }); </script> </div> </div> </body> </html>

如何在Bootstrap-DateTimePicker中啟用日期和時間選擇器

問題描述

1 個解決方案

解決方案1
1 已采納 2018-09-04 09:21:26

如何在Bootstrap-DateTimePicker中啟用日期和時間選擇器

問題描述

1 個解決方案

解決方案1 1 已采納 2018-09-04 09:21:26

解決方案1
1 已采納 2018-09-04 09:21:26