【WEB开发】HTML5页面type=‘date’的input标签
当前位置:点晴教程→知识管理交流
→『 技术文档交流 』
1、调用浏览器自带时间控件,input的type属性有以下几种写法: type="date" //显示年、月、日 type="month" //显示年、月 type="week" //显示年、周 type="datetime-local" //显示年、月、日、时、分 上述属性在chrome、safari、opera浏览器中,点击三角按钮会出现时间控件的弹框,供用户选择。但是在firefox中没有时间控件的支持,不会出现时间弹框。 在移动端Android和iPhone都能调用自己的时间控件供用户选择输入,但是每种手机的浏览器在选择时间后,显示在输入框中的样式还是会有差别。尤其是在选择了时、分的时候。 iPhone手机能正常选择和显示,会显示为:‘2016-11-11 18:00’这种,而且各系统版本兼容不错。 个别安卓手机却显示为:‘2016-11-11T18:00’这种(日期和小时之间是T)。 在调试获取时间对象输出时发现:所有浏览器输出的都是带有T的时间对象,但是在页面展示时iPhone手机和部分安卓手机做了处理,使时间正常显示,而一些安卓手机可能没注意到这个细节,在页面展示时没做处理。这时就需要开发人员对展示内容做一下处理了(其实用‘ ’将T替换掉再展示就行了)。 2、在手机中input标签调用时间控件,样式表现不同,有些安卓机会带深灰色背景,iPhone为白色背景色。 3、对于js事件的支持,input的focus,blur都支持,但是有些安卓机不支持change事件(伤害到我了,没有找到解决办法。不知道用户在时间控件上选择时间确定后触发什么时间)。iPhone456都支持。其他的事件暂时没发现区别。 4、input调用的时间控件没有时间限制筛选功能,不能满足多功能的需求。 因为没有找到功能齐全兼容良好的移动端时间插件,在做项目时自己用了笨方法,获取用户选择的时间对象,然后自己写逻辑进行限制。 该文章在 2025/4/2 10:11:35 编辑过 |
关键字查询
相关文章
正在查询... |