html5的input date在手机中怎么侦听用户点击输入完成的按钮?
在iOS和安卓自带浏览器里面,点击input date是会弹出一个弹窗让用户输入日期的,而且都会有个确定按钮(iOS里面叫“完成”,android里面叫“设置”按钮),怎么侦听这个按钮的点击事件?
还有,我用input标签的max和min属性不能设置这个input date的可设置范围吗?
第一个问题我刚刚发现用onchange
事件就行了。(安卓此时需要点击确定按钮才会触发,iOS则每改变一个日期,不需要点击确定都会触发。)
但是max和min还是没效果,值是不是有固定的格式?用精确到毫秒的时间戳不行,用2016-02-26这种格式的字符串也不行。
@AlanZhang 提到的
onblur
和onfocusout
在iOS中是可以做到点击“完成”按钮后触发的,有需求的同学可以使用hack
如果你对这篇内容有疑问,欢迎到本站社区发帖提问 参与讨论,获取更多帮助,或者扫码二维码加入 Web 技术交流群。
绑定邮箱获取回复消息
由于您还没有绑定你的真实邮箱,如果其他用户或者作者回复了您的评论,将不能在第一时间通知您!
发布评论
评论(8)
多测了下, android 的 Chrome 用下面两个不行。题主说 onchange 可以,我就不折腾了~
onblur
和onfocusout
事件都可以满足你的要求,具体参考该链接 HTML DOM Events 的 Form Events 部分,可以设置范围,具体参考该链接 HTML DOM Input Date Object 中的 Input Date Object Properties 部分对 max 和 min 属性的描述。
可能需要fq
补个例子:http://jsfiddle.net/c8tdoLee/embedded/
拿手机浏览器看这个就是你要的结果。
外面套表单。。监听submit事件
就前端而言,如果你要给一个按钮添加点击事件,直接click就可以了,至于你设置input标签的max和min属性没起作用(你是这个意思吧?),你要看你是不是设置对了,要看你是什么属性,有些标签是没有一些属性
我表示onchange事件在安卓无效
实在不行自己找个日历插件用。。。
angular 有ng-change
blur在安卓机无法监听点击完成,只能完成之后再点击其他地方才会触发,安卓机有没有方法监听,使用onchange只能数据变了才能触发
我用的是vue(相应的ng和react应该都可以可实现问题的解决方案)
第一个问题可以使用data绑定。把data绑定到input中,然后用watch去监听。
第二个问题我用直接写了个方法去判断的、暂时没有解决方案。