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打包类,基本可以实现所有的滚动效果,太强了
Dec 08 Javascript
Firefox window.close()的使用注意事项
Apr 11 Javascript
jquery表格内容筛选实现思路及代码
Apr 16 Javascript
JQuery性能优化的几点建议
May 14 Javascript
JavaScript中this详解
Sep 01 Javascript
跟我学习javascript创建对象(类)的8种方法
Nov 20 Javascript
JavaScript实现删除数组重复元素的5种常用高效算法总结
Jan 18 Javascript
vue+springboot前后端分离实现单点登录跨域问题解决方法
Jan 30 Javascript
Chart.js 轻量级HTML5图表绘制工具库(知识整理)
May 22 Javascript
vue输入节流,避免实时请求接口的实例代码
Oct 30 Javascript
vue在路由中验证token是否存在的简单实现
Nov 11 Javascript
关于JS中的作用域中的问题思考分享
Apr 06 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
40年前的这部特摄片恐龙特级克塞号80后的共同回忆
2020/03/08 日漫
支持oicq头像的留言簿(二)
2006/10/09 PHP
全局记录程序片段的运行时间 正确找到程序逻辑耗时多的断点
2011/01/06 PHP
PHP 数据结构队列(SplQueue)和优先队列(SplPriorityQueue)简单使用实例
2015/05/12 PHP
PHP文件后缀不强制为.php方法
2019/03/31 PHP
基于Laravel(5.4版本)的基本增删改查操作方法
2019/10/11 PHP
PHP页面静态化――纯静态与伪静态用法详解
2020/06/05 PHP
jQuery新闻滚动插件 jquery.roller.js
2011/06/27 Javascript
初学js 新节点的创建 删除 的步骤
2011/07/04 Javascript
jQuery+css+html实现页面遮罩弹出框
2013/03/21 Javascript
JS在TextArea光标位置插入文字并实现移动光标到文字末尾
2013/06/21 Javascript
javascript的parseFloat()方法精度问题探讨
2013/11/26 Javascript
js仿土豆网带缩略图的焦点图片切换效果实现方法
2015/02/23 Javascript
Javascript之Math对象详解
2016/06/07 Javascript
js学习阶段总结(必看篇)
2016/06/16 Javascript
10个在JavaScript开发中常遇到的BUG
2017/12/18 Javascript
解决vue-router进行build无法正常显示路由页面的问题
2018/03/06 Javascript
vue+moment实现倒计时效果
2019/08/26 Javascript
JS实现移动端可折叠导航菜单(现代都市风)
2020/07/07 Javascript
JS+CSS实现炫酷光感效果
2020/09/05 Javascript
JQuery Ajax如何实现注册检测用户名
2020/09/25 jQuery
[48:27]EG vs Liquid 2018国际邀请赛淘汰赛BO3 第二场 8.25
2018/08/29 DOTA
[49:05]OG vs Newbee 2019DOTA2国际邀请赛淘汰赛 胜者组 BO3 第二场 8.21.mp4
2020/07/19 DOTA
windows下ipython的安装与使用详解
2016/10/20 Python
Python字符串、整数、和浮点型数相互转换实例
2018/08/04 Python
利用PyQt5+Matplotlib 绘制静态/动态图的实现代码
2020/07/13 Python
日本化妆品植村秀俄罗斯官方网站:Shu Uemura俄罗斯
2020/02/01 全球购物
亚马逊意大利站点:Amazon.it
2020/12/31 全球购物
学校运动会开幕演讲稿
2014/01/04 职场文书
求职简历的自我评价
2014/01/31 职场文书
自荐信如何制作?
2014/02/21 职场文书
《青海高原一株柳》教学反思
2014/04/25 职场文书
优秀班集体先进事迹材料
2014/05/28 职场文书
Django 如何实现文件上传下载
2021/04/08 Python
Java生成日期时间存入Mysql数据库的实现方法
2022/03/03 Java/Android
zabbix配置nginx监控的实现
2022/05/25 Servers