Question

我正在为三星智能电视创建应用程序。因为我希望音量条显示5秒后，它必须隐藏。如果用户连续按下音量，则必须在5秒后隐藏，用户停止按下按钮。我试过这样：

var vt;
    if($("#volume").css('display')=='none'){
        $("#volume").show(); 
        vt=setInterval(function(){$("#volume").hide();},5000);

    }
    else{
        clearInterval(vt);
        vt=setInterval(function(){$("#volume").hide();},5000);
    }

当用户按下按钮时，它不会清除间隔，而是为每次点击创建实例

Answer 1

试试这个：

if($("#volume").css('display')=='none'){
    $("#volume").show(); 
    vt = setTimeout(function(){$("#volume").hide();},5000);
}
else{
    clearTimeout(vt);
    vt = setTimeout(function(){$("#volume").hide();},5000);
}

Answer 2

这是一个有点复杂的解决方案，从下划线库中挑选。

var debounce = function(func, wait, immediate) {
    var timeout, result;
    return function() {
        var context = this, args = arguments;
        var later = function() {
            timeout = null;
            if (!immediate) {
                result = func.apply(context, args);
            }
        };
        var callNow = immediate && !timeout;
        clearTimeout(timeout);
        timeout = setTimeout(later, wait);
        if (callNow) {
            result = func.apply(context, args);
        }
        return result;
    };
};


var clickHandler = function(){
    $("#volume").hide();
}

var debouncedClickHandler = debounce(clickHandler, 5000);

$('body').on('click', debouncedClickHandler) //change this line to your click handler

现在你不需要做任何事情，clickHandler只有在从最后一次调用debouncedClickHandler延迟5秒后才会被调用

setinterval和clearinterval无法正常工作

2 个答案: