fastclick.js可以提高移動端click響應速度 <!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>點觸事件</title>
<style type="text/css">
.box{
width:300px;
height:300px;
background-color: pink;
}
</style>
</head>
<body>
<div class="box"></div>
<script>
window.onload = function(){
var bindTapEvent = function(dom, callback){
var isMove = false; //是否滑動
var startTime = 0; //點觸開始時間
dom.addEventListener("touchstart", function(e){
startTime = Date.now();
});
dom.addEventListener("touchmove", function(e){
isMove = true;
});
dom.addEventListener("touchend", function(e){
//時間小于150ms,并且沒有滑動才認為是點觸事件
if((Date.now() - startTime < 150) && !isMove){
callback && callback.call(this, e);
}
});
/*dom.addEventListener('click',function () {
//console.log('click');
});*/
}
bindTapEvent(document.querySelector(".box"), function(e){
console.log("點觸");
console.log(this);
console.log(e);
});
}
</script>
</body>
</html>