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 相关文章推荐
JQuery 绑定select标签的onchange事件,弹出选择的值,并实现跳转、传参
Jan 06 Javascript
扩展jquery实现客户端表格的分页、排序功能代码
Mar 16 Javascript
jQuery源码分析-02正则表达式 RegExp 常用正则表达式
Nov 14 Javascript
Javascript数组的排序 sort()方法和reverse()方法
Jun 04 Javascript
Javascript的数组与字典用法与遍历对象的属性技巧
Nov 07 Javascript
javascript中的原型链深入理解
Feb 24 Javascript
js实现图片拖动改变顺序附图
May 13 Javascript
vue 组件 全局注册和局部注册的实现
Feb 28 Javascript
mpvue中使用flyjs全局拦截的实现代码
Sep 13 Javascript
JavaScript常见事件处理程序实例总结
Jan 05 Javascript
Android 自定义view仿微信相机单击拍照长按录视频按钮
Jul 19 Javascript
JS在Array数组中按指定位置删除或添加元素对象方法示例
Nov 19 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
实战mysql导出中文乱码及phpmyadmin导入中文乱码的解决方法
2010/06/11 PHP
提示Trying to clone an uncloneable object of class Imagic的解决
2011/10/27 PHP
php读取目录及子目录下所有文件名的方法
2014/10/20 PHP
PHP工厂模式简单实现方法示例
2018/05/23 PHP
PHP的PDO错误与错误处理
2019/01/27 PHP
关于锚点跳转及jQuery下相关操作与插件
2012/10/01 Javascript
jquery焦点图片切换(数字标注/手动/自动播放/横向滚动)
2013/01/24 Javascript
javascript将浮点数转换成整数的三个方法
2014/06/23 Javascript
JQuery1.8 判断元素是否绑定事件的方法
2014/07/10 Javascript
JQuery boxy插件在IE中边角图片不显示问题的解决
2015/05/20 Javascript
JavaScript+html5 canvas制作的百花齐放效果完整实例
2016/01/26 Javascript
JS对HTML表格进行增删改操作
2016/08/22 Javascript
对vue里函数的调用顺序介绍
2018/03/17 Javascript
vue自定义一个v-model的实现代码
2018/06/21 Javascript
详解node.js的http模块实例演示
2018/07/12 Javascript
vuejs实现ready函数加载完之后执行某个函数的方法
2018/08/31 Javascript
详解Vue SSR( Vue2 + Koa2 + Webpack4)配置指南
2018/11/13 Javascript
vuex的使用步骤
2021/01/06 Vue.js
[40:03]Liquid vs Optic 2018国际邀请赛淘汰赛BO3 第一场 8.21
2018/08/22 DOTA
Python3运算符常见用法分析
2020/02/14 Python
Python爬虫requests库多种用法实例
2020/05/28 Python
Python爬虫JSON及JSONPath运行原理详解
2020/06/04 Python
pytorch  网络参数 weight bias 初始化详解
2020/06/24 Python
matplotlib设置颜色、标记、线条,让你的图像更加丰富(推荐)
2020/09/25 Python
HTML+CSS3 模仿Windows7 桌面效果
2010/06/17 HTML / CSS
Under Armour安德玛荷兰官网:美国高端运动科技品牌
2019/07/10 全球购物
如何清空Session
2015/02/23 面试题
新护士岗前培训制度
2014/02/02 职场文书
秋季运动会广播稿大全
2014/02/17 职场文书
医学求职信
2014/05/28 职场文书
地方课程教学计划
2015/01/19 职场文书
计算机专业自荐信
2015/03/05 职场文书
债务纠纷起诉书
2015/05/20 职场文书
挂职锻炼工作总结2015
2015/05/28 职场文书
pdf论文中python画的图Type 3 fonts字体不兼容的解决方案
2021/04/24 Python
如何使用vue3打造一个物料库
2021/05/08 Vue.js