javascript - 每秒计时几秒

Question

我正在尝试用 Javascript 对一个小游戏进行一些测试。我想让按钮超时“X”秒。我这样做了，但它不会根据剩余时间进行实时更新。

Javascript:

function cd(button, x) {
    var ms = x * 1000;             //Change the seconds to Milliseconds
    var oldValue = button.innerHTML;

    button.setAttribute('disabled', true);
    button.innerHTML = oldValue +  " [" + x + "]";


    setTimeout(function(){
        button.innerHTML = oldValue;
        button.removeAttribute('disabled');
    }, ms);

}

函数调用:

cd(document.getElementById("click"), 5);

HTML:

<button type="button" id="click" onclick="cd(this)">Get a banana</button>

我试图将两者结合起来，使其每秒使用 setInterval 更新“x”秒，但它不起作用。

Answer 1

这是您要找的吗？

DEMO

JavaScript:

// store the oldValue here
var oldValue = null;

function cd(button, x) {
    var ms = x * 1000;

    // if you dont do this, you will get "Get a banana [5] [4] etc..."
    if(!oldValue){
        oldValue = button.innerHTML;
    }

    button.setAttribute('disabled', true);

    button.innerHTML = oldValue +  " [" + x + "]";

    setTimeout(function(){
        // decrease x
        x--;
        if(x > 0){
            cd(button, x);
        }else{
            // remove attribute
            button.removeAttribute('disabled');
            // change back to oldValue
            button.innerHTML = oldValue;
            //reset oldValue
            oldValue = null;
        }
    }, 1000);

}