<未完善>
问题:
移动端click会有200~300ms的延迟,而延迟响应会出现穿透,点击会触发非当前层的点击事件。
1、tap模拟click事件
<button id="btn">click</button>
function tap (ele, callback) { var startTime = 0 var ismove = false var maxTime = 200 ele.addEventListener('touchstart', function(e) { startTime = Date.now() ismove = false }) ele.addEventListener('touchmove', function(e) { ismove = true }) ele.addEventListener('touchend', function(e) { if (ismove) { return } if (Date.now() - startTime > maxTime) { return } callback(e) }) } function fnc(e) { console.log(e) } const btn = document.getElementById('btn') tap(btn, fnc)
2. 模拟双击事件
function dbfnc(e) { if (dbfnc.clicked === undefined) { // 第一次点击 dbfnc.clicked = 1 dbfnc.startTime = Date.now() } else if (dbfnc.clicked < 1) { // 第一次点击 dbfnc.clicked++ dbfnc.startTime = Date.now() } else if (dbfnc.clicked === 1) { // 第二次点击 dbfnc.clicked = 0 if (Date.now() - dbfnc.startTime < 500) { console.log('双击需要执行的代码。', e) } } } tap(btn, dbfnc)