- html - 出于某种原因,IE8 对我的 Sass 文件中继承的 html5 CSS 不友好?
- JMeter 在响应断言中使用 span 标签的问题
- html - 在 :hover and :active? 上具有不同效果的 CSS 动画
- html - 相对于居中的 html 内容固定的 CSS 重复背景?
我需要为日期和时间准备一个输入,它可以在特定日期禁用时间。我为此准备了一个 Bootstrap 3 DateTimePicker:
$('#ScheduledAt').datetimepicker({
format: 'YYYY-MM-DD HH:mm',
disabledDates: [
moment("2017-12-05 9:00"),
],
daysOfWeekDisabled: [0, 7],
stepping: 30,
enabledHours: [8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18],
})
步进是 30 分钟,所以在 2017-12-05 9:00 有人预订了东西,但在 2017-12-05 9:30 我可以创建预订。当我像上面那样设置时,我不能点击这个特定的日期并选择另一个时间。有没有可能这样做?还是其他插件?
最佳答案
你试过 disabledtimeintervals
了吗? eonasdan bootstrap-datetimepicker 的选项?
这是一个 CodePen:https://codepen.io/beaver71/pen/gXyrwR显示此功能。
$('#ScheduledAt').datetimepicker({
format: 'YYYY-MM-DD HH:mm',
toolbarPlacement: 'top',
showClear: true,
showClose: true,
sideBySide: true,
disabledTimeIntervals: [
[moment("2017-12-05 8:40"),moment("2017-12-05 9:20")],
],
daysOfWeekDisabled: [0, 7],
stepping: 30,
enabledHours: [8, 9, 10, 11, 12, 13, 14, 15, 16, 17, 18],
})
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.5/js/bootstrap.min.js?ver=1"></script>
<script src="https://cdnjs.cloudflare.com/ajax/libs/moment.js/2.19.0/moment-with-locales.js"></script>
<script src="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/5a991bff/src/js/bootstrap-datetimepicker.js"></script>
<link href="https://cdn.rawgit.com/Eonasdan/bootstrap-datetimepicker/master/build/css/bootstrap-datetimepicker.css" rel="stylesheet"/>
<link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" rel="stylesheet"/>
<div class="row">
<div class="col-md-4">
<div class="panel-body">
<form id="srcForm">
<div class="row">
<div class="form-group col-xs-12">
<label>Date</label>
<div id="ScheduledAt" class="input-group">
<input type="text" class="form-control" name="from">
<span class="input-group-addon">
<span class="glyphicon glyphicon-calendar"></span>
</span>
</div>
</div>
</div>
</form>
</div>
</div>
</div>
区间[moment("2017-12-05 8:40"),moment("2017-12-05 9:20")]
用于禁用2017- 12-05 9:00
日期时间。
关于javascript - DateTimePicker 类预约系统,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/47642835/
预约《余烬风暴》游戏 抽联想笔记本 手机打开链接 点击抽电脑 进入活动页面 收入手机号验证码预约游戏即可获得抽奖机会一次 可抽联想笔记本 鼠标 背包等等实物 非必中的 大多数都是公测礼包 可以去
我是这些方面的新手,我对“预约专业组件”有疑问 当我尝试在前端进行“预订”时,它向我显示错误 错误是: 1064 YOU HAVE AN ERROR IN YOUR SQL SYNTAX; CHECK
结缘女武神瓜分百万Q币 可抽5-648Q币 手Q打开链接 预约《征服与霸业》手游 集齐6大女武神瓜分5-648Q币 下拉活动页面完成任务可免费领取女武神卡 邀请好友助力还可免费获得卡片 保底5Q
我是一名优秀的程序员,十分优秀!