By default, browsers on mobile devices will wait approximately 300 milliseconds after the user taps the screen before triggering a click event. This is to check whether the user is double-clicking.
In order to respond immediately to the user’s click event, FastClick is created.
usage:
Introduce fastclick.min.js, and then add:
1 // Solve the 300ms delay of mobile click events
2 $(function() {
3 FastClick.attach(document.body);
4 });
The fastclick.min.js code is as follows:
1 !function(){"use strict";function t(e,o){<!-- -->function i(t,e){<!-- -->return function(){< !-- -->return t.apply(e,arguments)}}var r;if(o=o||{},this.trackingClick=!1,this.trackingClickStart=0,this.targetElement=null,this .touchStartX=0,this.touchStartY=0,this.lastTouchIdentifier=0,this.touchBoundary=o.touchBoundary||10,this.layer=e,this.tapDelay=o.tapDelay||200,this.tapTimeout=o .tapTimeout||700,!t.notNeeded(e)){<!-- -->for(var a=["onMouse","onClick","onTouchStart","onTouchMove","onTouchEnd","onTouchCancel "],c=0,s=a.length;c<s;c + + )this[a[c]]=i(this[a[c]],this);n & amp; & amp;( e.addEventListener("mouseover",this.onMouse,!0),e.addEventListener("mousedown",this.onMouse,!0),e.addEventListener("mouseup",this.onMouse,!0)),e .addEventListener("click",this.onClick,!0),e.addEventListener("touchstart",this.onTouchStart,!1),e.addEventListener("touchmove",this.onTouchMove,!1),e.addEventListener ("touchend",this.onTouchEnd,!1),e.addEventListener("touchcancel",this.onTouchCancel,!1),Event.prototype.stopImmediatePropagation||(e.removeEventListener=function(t,n,o){ <!-- -->var i=Node.prototype.removeEventListener;"click"===t?i.call(e,t,n.hijacked||n,o):i.call(e,t, n,o)},e.addEventListener=function(t,n,o){<!-- -->var i=Node.prototype.addEventListener;"click"===t?i.call(e,t ,n.hijacked||(n.hijacked=function(t){t.propagationStopped||n(t)}),o):i.call(e,t,n,o)}),"function"= =typeof e.onclick & amp; & amp;(r=e.onclick,e.addEventListener("click",function(t){r(t)},!1),e.onclick=null)}}var e=navigator.userAgent.indexOf("Windows Phone")>=0,n=navigator.userAgent.indexOf("Android")>0 & amp; & amp;!e,o=/iP(ad|hone|od )/.test(navigator.userAgent) & amp; & amp;!e,i=o & amp; & amp;/OS 4_\d(_\d)?/.test(navigator.userAgent),r=o & amp; & amp;/OS [6-7]_\d/.test(navigator.userAgent),a=navigator.userAgent.indexOf("BB10")>0;t.prototype.needsClick=function(t) {<!-- -->switch(t.nodeName.toLowerCase()){<!-- -->case"button":case"select":case"textarea":if(t.disabled)return!0 ;break;case"input":if(o & amp; & amp;"file"===t.type||t.disabled)return!0;break;case"label":case"iframe":case" video":return!0}return/\bneedsclick\b/.test(t.className)},t.prototype.needsFocus=function(t){<!-- -->switch(t.nodeName.toLowerCase() ){<!-- -->case"textarea":return!0;case"select":return!n;case"input":switch(t.type){<!-- -->case"button" :case"checkbox":case"file":case"image":case"radio":case"submit":return!1}return!t.disabled & amp; & amp;!t.readOnly;default:return/ \bneedsfocus\b/.test(t.className)}},t.prototype.sendClick=function(t,e){<!-- -->var n,o;document.activeElement & amp; & amp;document .activeElement!==t & amp; & amp;document.activeElement.blur(),o=e.changedTouches[0],(n=document.createEvent("MouseEvents")).initMouseEvent(this.determineEventType(t) ,!0,!0,window,1,o.screenX,o.screenY,o.clientX,o.clientY,!1,!1,!1,!1,0,null),n.forwardedTouchEvent=!0 ,t.dispatchEvent(n)},t.prototype.determineEventType=function(t){<!-- -->return n & amp; & amp;"select"===t.tagName.toLowerCase()?" mousedown":"click"},t.prototype.focus=function(t){<!-- -->var e;o & amp; & amp;t.setSelectionRange & amp; & amp;0!==t .type.indexOf("date") & amp; & amp;"time"!==t.type & amp; & amp;"month"!==t.type & amp; & amp;"email"!= =t.type?(e=t.value.length,t.setSelectionRange(e,e)):t.focus()},t.prototype.updateScrollParent=function(t){<!-- -->var e,n;if(!(e=t.fastClickScrollParent)||!e.contains(t)){n=t;do{<!-- -->if(n.scrollHeight>n.offsetHeight){e =n,t.fastClickScrollParent=n;break}n=n.parentElement}while(n)}e & amp; & amp;(e.fastClickLastScrollTop=e.scrollTop)},t.prototype.getTargetElementFromEventTarget=function(t) {<!-- -->return t.nodeType===Node.TEXT_NODE?t.parentNode:t},t.prototype.onTouchStart=function(t){<!-- -->var e,n,r ;if(t.targetTouches.length>1)return!0;if(e=this.getTargetElementFromEventTarget(t.target),n=t.targetTouches[0],o){<!-- -->if(( r=window.getSelection()).rangeCount & amp; & amp;!r.isCollapsed)return!0;if(!i){<!-- -->if(n.identifier & amp; & amp;n .identifier===this.lastTouchIdentifier)return t.preventDefault(),!1;this.lastTouchIdentifier=n.identifier,this.updateScrollParent(e)}}return this.trackingClick=!0,this.trackingClickStart=t.timeStamp ,this.targetElement=e,this.touchStartX=n.pageX,this.touchStartY=n.pageY,t.timeStamp-this.lastClickTime<this.tapDelay & amp; & amp;t.preventDefault(),!0}, t.prototype.touchHasMoved=function(t){<!-- -->var e=t.changedTouches[0],n=this.touchBoundary;return Math.abs(e.pageX-this.touchStartX)>n| |Math.abs(e.pageY-this.touchStartY)>n},t.prototype.onTouchMove=function(t){<!-- -->return!this.trackingClick||((this.targetElement!== this.getTargetElementFromEventTarget(t.target)||this.touchHasMoved(t)) & amp; & amp;(this.trackingClick=!1,this.targetElement=null),!0)},t.prototype.findControl=function (t){<!-- -->return void 0!==t.control?t.control:t.htmlFor?document.getElementById(t.htmlFor):t.querySelector("button, input:not([ type=hidden]), keygen, meter, output, progress, select, textarea")},t.prototype.onTouchEnd=function(t){<!-- -->var e,a,c,s,u, l=this.targetElement;if(!this.trackingClick)return!0;if(t.timeStamp-this.lastClickTime<this.tapDelay)return this.cancelNextClick=!0,!0;if(t.timeStamp-this. trackingClickStart>this.tapTimeout)return!0;if(this.cancelNextClick=!1,this.lastClickTime=t.timeStamp,a=this.trackingClickStart,this.trackingClick=!1,this.trackingClickStart=0,r & amp; & amp;(u=t.changedTouches[0],(l=document.elementFromPoint(u.pageX-window.pageXOffset,u.pageY-window.pageYOffset)||l).fastClickScrollParent=this.targetElement.fastClickScrollParent), "label"===(c=l.tagName.toLowerCase())){<!-- -->if(e=this.findControl(l)){<!-- -->if(this.focus (l),n)return!1;l=e}}else if(this.needsFocus(l))return t.timeStamp-a>100||o & amp; & amp;window.top!==window & amp; & amp;"input"===c?(this.targetElement=null,!1):(this.focus(l),this.sendClick(l,t),o & amp; & amp;"select "===c||(this.targetElement=null,t.preventDefault()),!1);return!(!o||i||!(s=l.fastClickScrollParent)||s.fastClickLastScrollTop== =s.scrollTop)||(this.needsClick(l)||(t.preventDefault(),this.sendClick(l,t)),!1)},t.prototype.onTouchCancel=function(){<! -- -->this.trackingClick=!1,this.targetElement=null},t.prototype.onMouse=function(t){<!-- -->return!this.targetElement||(!!t.forwardedTouchEvent ||(!t.cancelable||(!(!this.needsClick(this.targetElement)||this.cancelNextClick)||(t.stopImmediatePropagation?t.stopImmediatePropagation():t.propagationStopped=!0,t.stopPropagation (),t.preventDefault(),!1))))},t.prototype.onClick=function(t){<!-- -->var e;return this.trackingClick?(this.targetElement=null, this.trackingClick=!1,!0):"submit"===t.target.type & amp; & amp;0===t.detail||((e=this.onMouse(t))|| (this.targetElement=null),e)},t.prototype.destroy=function(){<!-- -->var t=this.layer;n & amp; & amp;(t.removeEventListener("mouseover ",this.onMouse,!0),t.removeEventListener("mousedown",this.onMouse,!0),t.removeEventListener("mouseup",this.onMouse,!0)),t.removeEventListener("click" ,this.onClick,!0),t.removeEventListener("touchstart",this.onTouchStart,!1),t.removeEventListener("touchmove",this.onTouchMove,!1),t.removeEventListener("touchend",this .onTouchEnd,!1),t.removeEventListener("touchcancel",this.onTouchCancel,!1)},t.notNeeded=function(t){<!-- -->var e,o,i;if(void 0===window.ontouchstart)return!0;if(o= + (/Chrome\/([0-9] + )/.exec(navigator.userAgent)||[,0])[1]){ <!-- -->if(!n)return!0;if(e=document.querySelector("meta[name=viewport]")){<!-- -->if(-1!==e .content.indexOf("user-scalable=no"))return!0;if(o>31 & amp; & amp;document.documentElement.scrollWidth<=window.outerWidth)return!0}}if(a & amp ; & amp;(i=navigator.userAgent.match(/Version\/([0-9]*)\.([0-9]*)/))[1]>=10 & amp; & amp; i[2]>=3 & amp; & amp;(e=document.querySelector("meta[name=viewport]"))){<!-- -->if(-1!==e.content. indexOf("user-scalable=no"))return!0;if(document.documentElement.scrollWidth<=window.outerWidth)return!0}return"none"===t.style.msTouchAction||"manipulation"= ==t.style.touchAction||(!!( + (/Firefox\/([0-9] + )/.exec(navigator.userAgent)||[,0])[1]>=27 & amp ; & amp;(e=document.querySelector("meta[name=viewport]")) & amp; & amp;(-1!==e.content.indexOf("user-scalable=no")||document .documentElement.scrollWidth<=window.outerWidth))||"none"===t.style.touchAction||"manipulation"===t.style.touchAction)},t.attach=function(e,n) {<!-- -->return new t(e,n)},"function"==typeof define & amp; & amp;"object"==typeof define.amd & amp; & amp;define.amd? define(function(){<!-- -->return t}):"undefined"!=typeof module & amp; & amp;module.exports?(module.exports=t.attach,module.exports.FastClick= t):window.FastClick=t}();