定义一个time类型的laydate
<input type="text" id='inputtime' readonly class="layui-input pdate">
layui.use('laydate', function () {
laydate.render({
elem: '#inputtime',
type: 'time',
format: 'HH:mm', //控制文本显示的内容格式
ready: formatminutes, //初始化加载time选择器前的执行方法
}
});
针对分钟仅显示固定项
var showminutes = ["00", "15", "30", "45"];
function formatminutes() {
var time = $('.laydate-time-list li ol')[1];
var minutes = $(time).find('li');
for (var i = 0; i < minutes.length; i++) {
var minval = minutes[i].innerText;
if (showminutes.indexOf(minval) < 0) {
minutes[i].hidden = true;
}
}
}
隐藏秒(仅显示时分)加上这块css代码
.laydate-time-list {
padding-bottom: 0;
overflow: hidden
}
.laydate-time-list > li {
width: 50% !important;
}
.laydate-time-list > li:last-child {
display: none;
}
效果显示
如果要限制时间只能选择,禁止用户手动输入,设置input 为 ‘readonly’ 就可以了。