Welcome to OStack Knowledge Sharing Community for programmer and developer-Open, Learning and Share
Welcome To Ask or Share your Answers For Others

Categories

0 votes
4.3k views
in Technique[技术] by (71.8m points)

js按钮双击怎么不让它执行两次单击事件

image

js按钮双击怎么不让它执行两次单击事件


与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
Welcome To Ask or Share your Answers For Others

1 Answer

0 votes
by (71.8m points)

别截图,直接贴代码。

思路:延时300ms执行click处理函数,如果是双击则取消执行click处理函数。

var s;
var delayClickTimerId;
var b = document.getElementById('bb');
b.onclick = () => {
    if(delayClickTimerId) {
        return;
    }
    delayClickTimerId = setTimeout(() => {
        delayClickTimerId = null;
        clearInterval(s);
        s = setInterval(() => {
            window.scrollBy(0, 20)
        }, 20)
        console.log('6666');
    }, 300);
    
}

b.ondbclick = () => {
    // 如果是double click,则取消click处理
    if(delayClickTimerId) {
        clearTimeout(delayClickTimerId);
        delayClickTimerId = null;
    }
    clearInterval(s);
}

与恶龙缠斗过久,自身亦成为恶龙;凝视深渊过久,深渊将回以凝视…
...