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 相关文章推荐
IE event.srcElement和FF event.target 功能比较
Mar 01 Javascript
JS实现QQ图片一闪一闪的效果小例子
Jul 31 Javascript
jQuery对下拉框,单选框,多选框的操作
Feb 21 Javascript
js模拟C#中List的简单实例
Mar 06 Javascript
基于jquery实现select选择框内容左右移动添加删除代码分享
Aug 25 Javascript
AngularJS 自定义过滤器详解及实例代码
Sep 14 Javascript
bootstrap table小案例
Oct 21 Javascript
JavaScript创建对象的七种方式(推荐)
Jun 26 Javascript
jquery 实现拖动文件上传加载进度条功能
Mar 18 jQuery
如何使node也支持从url加载一个module详解
Jun 05 Javascript
在Express中提供静态文件的实现方法
Oct 17 Javascript
vue video和vue-video-player实现视频铺满教程
Oct 30 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
从零开始的异世界生活:第二季延期后,B站上架了第二部剧场版
2020/05/06 日漫
实例简介PHP的一些高级面向对象编程的特性
2015/11/27 PHP
isArray()函数(JavaScript中对象类型判断的几种方法)
2009/11/26 Javascript
分享几个超级震憾的图片特效
2012/01/08 Javascript
获取中文字符串的实际长度代码
2014/06/05 Javascript
node.js中的fs.appendFile方法使用说明
2014/12/17 Javascript
jQuery使用before()和after()在元素前后添加内容的方法
2015/03/26 Javascript
jQuery实现简单下拉导航效果
2015/09/07 Javascript
详解JavaScript函数对象
2015/11/15 Javascript
jQuery+jsp下拉框联动获取本地数据的方法(附源码)
2015/12/03 Javascript
JavaScript中的this机制
2016/01/30 Javascript
怎么引入(调用)一个JS文件
2016/05/26 Javascript
详解jQuery简单的表单应用
2016/12/16 Javascript
jQuery命名空间与闭包用法示例
2017/01/12 Javascript
tsconfig.json配置详解
2019/05/17 Javascript
如何使用 vue-cli 创建模板项目
2020/11/19 Vue.js
Python 的 Socket 编程
2015/03/24 Python
基于scrapy实现的简单蜘蛛采集程序
2015/04/17 Python
Python编程实现删除VC临时文件及Debug目录的方法
2017/03/22 Python
用pandas中的DataFrame时选取行或列的方法
2018/07/11 Python
Python OpenCV之图片缩放的实现(cv2.resize)
2019/06/28 Python
Python谱减法语音降噪实例
2019/12/18 Python
matplotlib quiver箭图绘制案例
2020/04/17 Python
python 负数取模运算实例
2020/06/03 Python
python能否java成为主流语言吗
2020/06/22 Python
HTML5中原生的右键菜单创建方法
2016/06/28 HTML / CSS
HTML5实现音频和视频嵌入的方法
2018/08/22 HTML / CSS
HTML5拖拽文件上传的示例代码
2021/03/04 HTML / CSS
在阿联酋购买翻新手机和平板电脑:Teckzu
2021/02/12 全球购物
节能宣传周活动总结
2014/05/08 职场文书
职务任命书范本
2014/06/05 职场文书
房屋出租协议书范本(标准版)
2014/09/24 职场文书
小学母亲节活动总结
2015/02/10 职场文书
2015年医药代表工作总结
2015/04/25 职场文书
JavaScript 语句之常用 for 循环详解
2021/03/29 Javascript
JavaScript offset实现鼠标坐标获取和窗口内模块拖动
2021/05/30 Javascript