javascript - 非军事格式的日期范围选择器

标签 javascript jquery daterangepicker

我正在开展一个项目,该项目要求日期范围选择器采用非军事格式,同时仍强制执行最短日期。尽管设置了 timePicker24Hour: false,,但当前设置仍然有效,尽管 daterange 选择器采用军事格式 - 我需要选择器采用非军事格式。知道这是为什么以及如何实现吗?

$('input[name="launchdate"]').daterangepicker({
                                    timePicker24Hour: false,
                                    timePickerIncrement: 15,
                                    singleDatePicker: true,
                                    showDropdowns: true,
                                    timePicker: true,
                                    autoApply: true,
                                    minDate: moment().hour(13).minutes(0),
                                    format: 'hh:mm A',
                                    locale: {
                                        format: "MM/DD/YYYY hh:mm A"
                                    }
                                });

最佳答案

您的代码工作正常!

这是一个简短的片段,它为您提供了 非军事时间格式(12 小时)上午/下午。

var minDateValue = moment().add(13, 'hours');
$('input[name="launchdate"]').daterangepicker({
    timePicker24Hour: false,
    timePickerIncrement: 15,
    singleDatePicker: true,
    showDropdowns: true,
    timePicker: true,
    autoApply: true,
    minDate: minDateValue,
    format: 'hh:mm A',
    locale: {
        format: "MM/DD/YYYY hh:mm A"
    }
});
<!-- Include Required Prerequisites -->
<script type="text/javascript" src="//cdn.jsdelivr.net/jquery/1/jquery.min.js"></script>
<script type="text/javascript" src="//cdn.jsdelivr.net/momentjs/latest/moment.min.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap/3/css/bootstrap.css" />
 
<!-- Include Date Range Picker -->
<script type="text/javascript" src="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.js"></script>
<link rel="stylesheet" type="text/css" href="//cdn.jsdelivr.net/bootstrap.daterangepicker/2/daterangepicker.css" />


<!-- Input -->
<input name="launchdate"/>

如果你想获取军事时间格式(24小时):

删除 format 选项中的 A 并将 timePicker24Hour 设置为 true

编辑: 添加 moment().add(13, 'hours') 作为 minDate 值。

关于javascript - 非军事格式的日期范围选择器,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47717804/

相关文章:

javascript - HTML onload - 使用变量作为参数

javascript - 当元素出现在屏幕上时如何启动动画?

javascript - 日期范围选择器使用数据表

jquery IE8 - 一起使用 live ('blur' ,函数)和 live ('change' ,函数)

javascript - 表单进度条

javascript - Jquery dateRangePicker - 始终水平

javascript - CSS Scroll Snap 获取事件元素

javascript 或 jquery 仅输入文本数字并自动屏蔽

javascript - 正则表达式搜索不超过 2 个字母的字符串