移动端300ms延时和自定义事件

在移动端做多了会发现，当你点击时，会感觉机器会有延迟，特别是在ios上。后来查资料发现，这个问题叫做移动端300ms延迟移动端300ms延迟

链接文章中有几种解决方案，我对于某些方法测试了一下

1.meta viewport内声明

我在iphone6Plus（IOS12.x）测试，无效，依旧300ms延迟

2.touch-action:manipulation

我在iphone6Plus（IOS12.x）测试，无效，依旧300ms延迟

3.fastclick

我在iphone6Plus（IOS12.x）测试，有效，但是会存在点击穿透的问题

总之，都有问题。但是两受其害，取其轻者，我会选fastclick

接下来我们说下fastclick原理

在检测到touchend事件的时候，会通过DOM自定义事件立即出发模拟一个click事件，并把浏览器在300ms之后真正的click事件阻止掉

简单模拟下浏览器的自定义事件

var myDiv = document.querySelector('div')
//自定义一个事件look
var ev = new Event('look', {"bubbles":true,"cancelable":false})
//触发look
setTimeout(function(){
	myDiv.dispatchEvent(ev)
},1000)
	

//监听look事件
myDiv.addEventListener('look', function  () {
	console.log('dispatch')
})