标签: tempus-dominus-datetimepicker
如何在 tempusdominus 插件中显示 24 小时时间选择器
我正在使用这个插件https://tempusdominus.github.io/bootstrap-4/
插入日期时间选择器。我会显示时间选择器显示 24 小时内的时间（即不显示 02:00 PM 而是 14:00）。有一种方法可以使用 tempusdominus 插件来执行此操作。我按照指南，但它仍然显示上午和下午的时间。谢谢。
推荐指数
解决办法
查看次数
如何从bootstrap-datetime-picker插件中获取日期对象？
我正在尝试利用tempusdominus-datetimepicker-3在我的html表单中创建一个日期时间选择器.
但是,我需要能够从中获取所选日期.该插件有一个名为date的选项,根据该文档应该返回一个时刻对象或null.以下是该文档对此选项的说明
返回组件的模型当前日期,
moment对象或未null设置
但是,我正在努力访问该date选项.
也来自doc
注意所有选项都可通过
data属性访问,例如$('#datetimepicker').datetimepicker(OPTION, ARGUMENT)
所以我尝试了以下访问日期选项.
from = $('#datetimepicker').datetimepicker('date');
from = $('#datetimepicker').datetimepicker('data', 'date');
from = $('#datetimepicker').datetimepicker('data').date;
from = $('#datetimepicker').datetimepicker(function(e){
return e.date;
});
但是以上都没有返回对象.如何访问日期对象？
我认为一个不错的插件,这样一个将有更多的选择可读性像getDate(),setDate(date),getFomat()和setFormat(...)等; 或事件的例子,这应该消除像这样的问题,但不幸的是它没有.
javascript jquery datetimepicker eonasdan-datetimepicker tempus-dominus-datetimepicker
推荐指数
解决办法
查看次数
日期时间选择器的图标未显示
我使用 bootstrap 4,fontawesome v5.7 和这个插件https://tempusdominus.github.io/bootstrap-4/Usage/
日历正常工作，但我的问题是图标没有显示
看这个画面：
javascript jquery datepicker datetimepicker tempus-dominus-datetimepicker
推荐指数
解决办法
查看次数
使用Tempus Dominus中的viewDate函数设置日历值
我想做的是将事件日历中的月份和年份设置为Tempus Dominus datepicker。因此，主页上有一个大日历，用户可以将月份从11月更改为12月，并在12月创建一个新事件。
用户单击按钮以输入新事件后，我要将日期选择器设置为该月。根据页面上的文档，我可以通过以下方式访问功能：
$('#datetimepicker').datetimepicker(FUNCTION)
要设置viewDateI，我需要将日期() viewDate('11/21/2018')
放在一起（我尝试了几种不同的方式使其看起来像：
$('#datetimepicker').datetimepicker(viewDate('11/21/2018'))
我viewDate用单引号，尝试过的viewDate:和其他一些加了引号，但没有运气。我目前将其连接到一个按钮上，并对日期进行硬编码以进行测试。
我没有理解或做错了什么。
推荐指数
解决办法
查看次数
检查 Bootstrap4 datetimepicker 的下拉菜单？
我正在尝试检查此日期时间选择器的下拉菜单中的元素。但是，每当我单击任意位置时，即使强制处于焦点状态，下拉菜单也会关闭。
我使用的是 Mac 并使用 Chrome。
在此先感谢您的帮助！
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Tempus Dominus</title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta name="description" content="" />
<meta name="keywords" content="" />
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" />
<link rel="stylesheet" href="https://netdna.bootstrapcdn.com/font-awesome/4.7.0/css/font-awesome.css" />
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/highlight.js/9.9.0/styles/github.min.css" />
<link rel="stylesheet" href="https://tempusdominus.github.io/bootstrap-4/theme/css/tempusdominus-bootstrap-4.css" />
<style>
</style>
</head>
<body>
<script src="https://momentjs.com/downloads/moment.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/3.4.1/jquery.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/popper.js/1.14.7/umd/popper.min.js"></script>
<script type="text/javascript" src="https://cdnjs.cloudflare.com/ajax/libs/tempusdominus-bootstrap-4/5.0.0-alpha14/js/tempusdominus-bootstrap-4.min.js"></script>
<div class="container">
<div class="row">
<div class="col-sm-6">
<input type="text" class="form-control datetimepicker-input" id="datetimepicker5" data-toggle="datetimepicker" data-target="#datetimepicker5" />
</div>
<script type="text/javascript">
$(function() {
$('#datetimepicker5').datetimepicker();
});
</script>
</div>
</div>
</body> …datetimepicker bootstrap-datetimepicker bootstrap-4 tempus-dominus-datetimepicker
推荐指数
解决办法
查看次数
如何指定 Tempus Dominus 6 (getdatepicker) 的日期格式？
我使用的是 Tempus Dominus 版本 6，其文档位于https://getdatepicker.com/6/。
我的问题是：
- 如何设置日期格式？
我有这个 HTML 控件：
<div class="col-auto">
<label for="fromDateInput">From date:</label>
<div class="input-group" id="fromDate" data-td-target-input="nearest" data-td-target-toggle="nearest">
<input id="fromDateInput" type="text" class="form-control" data-td-target="#fromDate">
<span class="input-group-text" data-td-target="#fromDate" data-td-toggle="datetimepicker"><span class="fa-solid fa-calendar"></span></span>
</div>
</div>
我对 Tempus Dominus 日期选择器控件有以下 JavaScript 配置：
const picker = new tempusDominus.TempusDominus(document.getElementById('fromDate'), {
display: {
components: {
clock: false
}
},
localization: {
startOfTheWeek: 1
}
});
在浏览器中，该控件如下所示：
然后我选择一个日期：
正如您在字段中看到的，日期写为06/22/2022。但是，我希望格式为YYYY-MM-DD，以便本实例中的日期变为2022-06-22。我该如何实现这一目标？
推荐指数
解决办法
查看次数