fastclick插件导致日期(input[type="date"])控件无法被触发该如何解决


Posted in Javascript onNovember 09, 2015

本文作为一名新手,写的不好地方还请各位大家多多指教,以下内容只是给大家共勉以下我的解决方案,也是我个人的一个见解,有不同意见不同解决方案的朋友还请多多分享自己的解决办法。

首先,我们使用fastclick插件的初衷是解决“tap”事件“点透”的BUG;fastclick与tap都是利用“touch”事件来模拟“click”事件的;

然后我们来大致的了解一下fastclick的工作原理(来自往上的copy):

在我们的app中跟踪所有的TouchStart事件,在接收到touchend事件的时候,触发一个click事 件;

使用方法可找度娘;

但是问题来了,当使用了fastclick的时候,我们发现“日期”控件无法被触发了,是正常的点击时无法被触发,如果长按0.5S的样子还是可以触发的,但是问题还是已经存在,必须解决!

通过阅读fastclick的源码发现里面有个这个方法

fastclick插件导致日期(input[type="date"])控件无法被触发该如何解决

反正意思在上面也提到过,就是在接受到touchend事件的时候,触发一个click事件;

那么我的解决防范就是:

当touchend的时候我们判断一下他的event.target到底是啥,如果是date我们就不玩了,不要你fastclick了,用原生的去触发不就OK了,来个return false;

我的代码:

fastclick插件导致日期(input[type="date"])控件无法被触发该如何解决

这里if里面的条件就随便写咯,自己根据项目需求而定,反正你要的是到达某个特殊的条件时给他退出就好了;

本文作为一名新手,写的不好地方还请各位大家多多指教,以下内容只是给大家共勉以下我的解决方案,也是我个人的一个见解,有不同意见不同解决方案的朋友还请多多分享自己的解决办法。谢谢大家能够关注本篇文章,有你们的支持我会做的更好。

Javascript 相关文章推荐
js操作select控件的几种方法
Jun 02 Javascript
基于jquery的禁用右键、文本选择功能、复制按键的实现代码
Aug 27 Javascript
JavaScript1.6数组新特性介绍以及JQuery的几个工具方法
Dec 06 Javascript
避免jQuery名字冲突 noConflict()方法
Jul 30 Javascript
详解jQuery的表单验证插件--Validation
Dec 21 Javascript
Node.js复制文件的方法示例
Dec 29 Javascript
基于JavaScript实现的插入排序算法分析
Apr 14 Javascript
vue loadmore组件上拉加载更多功能示例代码
Jul 19 Javascript
帝国cms首页列表页实现点赞功能
Oct 30 Javascript
Vue混入mixins滚动触底的方法
Nov 22 Javascript
vue 百度地图(vue-baidu-map)绘制方向箭头折线实例代码详解
Apr 28 Javascript
AJAX实现指定部分页面刷新效果
Oct 16 Javascript
JavaScript实现同时调用多个函数的方法
Nov 09 #Javascript
javascript实现的登陆遮罩效果汇总
Nov 09 #Javascript
jquery实现简易的移动端验证表单
Nov 08 #Javascript
jquery UI Datepicker时间控件的使用方法(终结版)
Nov 07 #Javascript
jquery UI Datepicker时间控件的使用方法(加强版)
Nov 07 #Javascript
jquery UI Datepicker时间控件的使用方法(基础版)
Nov 07 #Javascript
jquery验证邮箱格式并显示提交按钮
Nov 07 #Javascript
You might like
PHP详细彻底学习Smarty
2008/03/27 PHP
php smarty模版引擎中的缓存应用
2009/12/02 PHP
基于php冒泡排序算法的深入理解
2013/06/09 PHP
laravel框架分组控制器和分组路由实现方法示例
2020/01/25 PHP
javascript 密码强弱度检测万能插件
2009/02/25 Javascript
jquery随机展示头像代码
2011/12/21 Javascript
javascript实现日历控件(年月日关闭按钮)
2012/12/12 Javascript
jQuery使用一个按钮控制图片的伸缩实现思路
2013/04/19 Javascript
onkeypress字符按键兼容所有浏览器使用介绍
2013/04/24 Javascript
Internet Explorer 11 浏览器介绍:别叫我IE
2014/09/28 Javascript
用户代理字符串userAgent可实现的四个识别
2015/09/20 Javascript
JS实现滑动菜单效果代码(包括Tab,选项卡,横向等效果)
2015/09/24 Javascript
vue.js中v-on:textInput无法执行事件问题的解决过程
2017/07/12 Javascript
node.js 发布订阅模式的实例
2017/09/10 Javascript
jQuery Validate插件ajax方式验证输入值的实例
2017/12/21 jQuery
Node 升级到最新稳定版的方法分享
2018/05/17 Javascript
JS实现随机点名器
2020/04/12 Javascript
vue 解决data中定义图片相对路径页面不显示的问题
2020/08/13 Javascript
Python标准库之随机数 (math包、random包)介绍
2014/11/25 Python
PyQt5每天必学之QSplitter实现窗口分隔
2018/04/19 Python
python tkinter窗口最大化的实现
2019/07/15 Python
postman传递当前时间戳实例详解
2019/09/14 Python
Python 中由 yield 实现异步操作
2020/05/04 Python
python爬虫利用selenium实现自动翻页爬取某鱼数据的思路详解
2020/12/22 Python
CSS3 border-image详解、应用及jQuery插件
2011/08/29 HTML / CSS
基于Html5实现的语音搜索功能
2019/05/13 HTML / CSS
雅诗兰黛旗下专业男士保养领导品牌:Lab Series
2017/05/15 全球购物
XD健身器材:Kevlar球、Crossfit健身球
2019/03/26 全球购物
研究生求职推荐信范文
2013/11/30 职场文书
农民工工资支付承诺函
2014/03/31 职场文书
党的群众路线教育实践活动个人自我剖析材料
2014/10/07 职场文书
2016拓展训练心得体会范文
2016/01/12 职场文书
7个你应该知道的JS原生错误类型
2021/04/29 Javascript
聊聊pytorch测试的时候为何要加上model.eval()
2021/05/23 Python
MySQL面试题讲解之如何设置Hash索引
2021/11/01 MySQL
MySQL提升大量数据查询效率的优化神器
2022/07/07 MySQL