使用 bootstrap 日期时间选择器动态禁用特定日期
Disable specific dates dynamically using bootstrap datetime picker
我正在使用 bootstrap datetimepicker(http://www.malot.fr/bootstrap-datetimepicker),但在 datetimepicker 初始化后没有禁用特定日期的方法。
如何使用上述日期选择器以编程方式禁用特定日期?
新版本的 bootstrap 日期时间选择器中有一个名为 setDatesDisabled() 的方法,但文档中没有提及。
它有这个功能,但在他们的网站上没有记录。你可以
- 创建选择器时在选项中设置"datesDisabled"
- 设置数据属性"data-dates-disabled"
- 调用选择器方法"setDatesDisabled"
为此使用您定义的格式。
第一个选项的示例:
$(".form_datetime").datetimepicker({
format: 'yyyy-mm-dd hh:ii',
datesDisabled: ["2018-04-28 12:00"]
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/smalot-bootstrap-datetimepicker/2.4.4/js/bootstrap-datetimepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://www.malot.fr/bootstrap-datetimepicker/bootstrap-datetimepicker/css/bootstrap-datetimepicker.css">
<input size="16" type="text" value="2018-04-27 14:45" readonly class="form_datetime">
我正在使用 bootstrap datetimepicker(http://www.malot.fr/bootstrap-datetimepicker),但在 datetimepicker 初始化后没有禁用特定日期的方法。
如何使用上述日期选择器以编程方式禁用特定日期?
新版本的 bootstrap 日期时间选择器中有一个名为 setDatesDisabled() 的方法,但文档中没有提及。
它有这个功能,但在他们的网站上没有记录。你可以
- 创建选择器时在选项中设置"datesDisabled"
- 设置数据属性"data-dates-disabled"
- 调用选择器方法"setDatesDisabled"
为此使用您定义的格式。
第一个选项的示例:
$(".form_datetime").datetimepicker({
format: 'yyyy-mm-dd hh:ii',
datesDisabled: ["2018-04-28 12:00"]
});
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.22.1/moment.min.js"></script>
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<script src="https://stackpath.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/smalot-bootstrap-datetimepicker/2.4.4/js/bootstrap-datetimepicker.min.js"></script>
<link rel="stylesheet" type="text/css" href="https://stackpath.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
<link rel="stylesheet" type="text/css" href="https://www.malot.fr/bootstrap-datetimepicker/bootstrap-datetimepicker/css/bootstrap-datetimepicker.css">
<input size="16" type="text" value="2018-04-27 14:45" readonly class="form_datetime">