laydate 时间控件去掉秒以及解决在移动端不能滑动的问题

一、时间控件去掉秒，保留时分
二、时间控件在移动端不能滚动

一、时间控件去掉秒，保留时分

方法一：使用 `ready` 回调函数

ready 控件在打开时触发。打开控件时让秒消失。

<script>
laydate.render({elem: '#endTime', //指定元素trigger: "click",type: 'time',format:'HH:mm',ready: noSecond(date)
});
function noSecond(date){$(".layui-laydate-list>li:last").css("overflow","hidden");$(".layui-laydate-list>li").css("width", "50%")
}
</script>

因为控件内置的样式中含有动画效果，所以这样写完用户体验不是很好。

方法二：使用css

参考-一粒小米-博客

<style>.laydate-time-list{padding-bottom:0;overflow:hidden}.laydate-time-list>li{width:50%!important;}.laydate-time-list>li:last-child { display: none;}.laydate-time-list ol>li:last-child{margin-bottom:.26rem;} /*这里0.26rem大概13像素，添加这个的原因是最后一个选项会被遮挡住，要把它显示出来*/
</style>

二、时间控件在移动端不能滚动

当我打开时间控件时，鼠标放在时分上不能滚动，但是我点击选中可见区域的时分后，滚动条就能出现。。。打开控制台选择元素发现有这样一条样式：

于是改了 overflow:hidden; 为 overflow-x: hidden !important;overflow-y:auto !important;，效果出现了。

<style>.laydate-time-list ol{overflow-x: hidden !important;overflow-y:auto !important;}
</style>

laydate 时间控件去掉秒以及解决在移动端不能滑动的问题相关推荐

解决：laydate时间控件与谷歌浏览器兼容问题
最近在开发时候用到了laydate时间控件,但是在谷歌浏览器中总是有问题只有在鼠标放在时间框内部,在通过顶部任务栏访问才会弹出时间设置窗口,后来找到了解决办法如下: 在如下代码中添加 trigger ...
laydate时间控件在谷歌浏览器中兼容性问题
时间控件离底部太近时 ,laydate时间控件在360里弹出正常,在谷歌浏览器中弹出有问题,总是闪一下也不弹出. 解决办法如下: 在如下代码中添加 trigger: 'click' //列表时间选择l ...
datetimepicker 时间控件 1899年问题以及解决方法
datetimepicker 时间控件 1899年问题以及解决方法参考文章: (1)datetimepicker 时间控件 1899年问题以及解决方法 (2)https://www.cnblogs. ...
layui layDate时间控件绑定多个文本框组件
layDate.js下载地址多个输入框都是实现选择日期时间,通过class去循环遍历绑定时间控件. <div><input type="text" class= ...
laydate限定时间控件去除秒
css控件样式修改 <style type="text/css">.layui-laydate-content>.layui-laydate-list {padd ...
laydate时间控件（开始日期、结束日期）
官方地址:https://www.layui.com/laydate/ 两个input框,限制开始时间和结束时间 <input type="text" id='startti ...
laydate时间控件有时候无效_新角度，如何无效没用地听课
嗨喽,大家好.这一期我想向大家展示一下如何无效地听课. 1.上课的时候,全程集中注意力,每一秒都不能放松,使自己的大脑保持高度紧张中.我们这么年轻,精神充沛得很,只要累不死就往死里学. 2.下课的时候 ...
bootstrap-datetimepicker时间控件
bootstrap-datetimepicker时间控件使用layui的laydate时间控件无法很好地嵌入到bootstap布局中(具体参考日期和时间组件文档 - layui.laydate),因 ...
html日期英文状态显示不出来,html 时间控件插件laydate，显示时分，不显示秒
概述项目中使用到了时间控件,不知为何input-->date无法弹出控件,故使用了js插件laydate.根据项目需求,时间要求精度为分,故隐藏秒控件. 参考网友博客,最终实现如下. 代码 l ...

laydate 时间控件去掉秒以及解决在移动端不能滑动的问题

一、时间控件去掉秒，保留时分

方法一：使用 `ready` 回调函数

方法二：使用css

二、时间控件在移动端不能滚动

laydate 时间控件去掉秒以及解决在移动端不能滑动的问题相关推荐

最新文章

热门文章

laydate 时间控件去掉秒以及解决在移动端不能滑动的问题

一、时间控件去掉秒，保留时分

方法一：使用 ready 回调函数

方法二：使用css

二、时间控件在移动端不能滚动

laydate 时间控件去掉秒以及解决在移动端不能滑动的问题相关推荐

最新文章

热门文章

方法一：使用 `ready` 回调函数