利用input新类型,解决移动端原生实现日期时间联动问题,精确到分

最近在做项目有一个需求是希望用原生的东西实现一个选完日期选时间的效果;

在此之前对于这样的页面需求,最常见的方案是用Javascript日期选择组件。这几乎是无可争议、别无选择的做法。

考虑到新需求,故最开始尝试考虑用两个标签实现,但是实现起来体验不好,需要挨个点击来选择;

经过查找资料遇到了一个之前未曾注意到的东西,可以完美实现上述需求;

就是input在HTML5中新加的对象:datetime-local

HTML代码如下:

<input type="datetime-local" value="" placeholder="">

  缺点是:由于各个浏览器对于时间空间的封装不同,所弹出的样式也不同,不能做到统一样式;不过在移动端的界面表现都挺良好的。

转载于:https://www.cnblogs.com/yanglei9308/p/6566190.html

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值