美文网首页
移动端防止多次点击

移动端防止多次点击

作者: 贾慧斌 | 来源:发表于2019-04-13 10:31 被阅读0次

    移动端防止多次点击,

    实现思路

    • 在指定的时间内,不执行用户的操作;

    技术核心

    • timer
    • cookie
    timer 实现方式
    // 定义全局变量
    var isCalled = false, timer;
    
    function igDoubleClick(callBack,interval) {
        
        if (!isCalled) {
            isCalled = true;
            clearTimeout(timer);
            timer = setTimeout(function(){
                isCalled = false;
            },interval);
    
            callBack();
        }
    }
    
    cookie 实现方式
            /**
         * 忽略多次点击
         * @param callBack 回调函数
         */
        igDoubleClick(callBack) {
            const nowTime = new Date().getTime();
            const clickTime = !tools.isEmpty(Cookies.get('firstTime')) ? Cookies.get('firstTime') : 0;
    
            if ((nowTime - clickTime) > 3000) {
                Cookies.set('firstTime', nowTime);
                callBack();
            }
        },
    

    相关文章

      网友评论

          本文标题:移动端防止多次点击

          本文链接:https://www.haomeiwen.com/subject/mehlwqtx.html