layui-laydate 时间选择中保留时分去掉秒--源码修改

由于layui-laydate弹框是js代码生成的，所以需要从js里面找到相关代码，把生成秒的地方改动。

当弹框出现后，在页面查看代码元素，可以发现 时、分、秒 选项是放在<ui><li><p>秒</p><ol>00</ol></li></ui>

如下图一所示。

所以我们需要在 layui-all.js 搜索 ol 找到输出ol的地方。下图红框地方即时控制循环输出时分秒的数组。把最后一个秒去掉自然也就不会循环生成秒输出了。截图中是我已经修改后的样子。

接下来，就是改时分的宽度了。毕竟去掉了一个列。会导致样式不好看，需要改宽度。

在laydate.css中搜索 layui-laydate-list>li 找到width 改成50%，原来的是33.3%。

OK到这里就改好了。如果你还想改一下选中状态的颜色。如下图，背景色，和字体颜色

 

效果展示

 

 

附：页面使用方法：

页面引入

<script type="text/javascript" src="${pageContext.request.contextPath}/js/layui/layui.all.js"></script>

页面视觉部分代码

<input class="layui-input"  name="effectiveTime" id="myTime" type="text" autocomplete="off" placeholder="--:--">

页面方法代码

<script>
    $(function () {
        laydate.render({
        elem: '#myTime',   //指向id名称
        type: 'time',      //类型
        format: 'HH:mm'}); //格式
    })
</script>