Warten Sie, bis setInterval () fertig ist

Ich möchte meinem Javascript-Code einen kleinen Würfeleffekt hinzufügen. Ich denke, ein guter Weg ist, das zu benutzensetInterval() Methode. Meine Idee war folgender Code (nur zum Testen):

function roleDice() {
        var i = Math.floor((Math.random() * 25) + 5);   
        var j = i;
        var test = setInterval(function(){
            i--;
            document.getElementById("dice").src = "./images/dice/dice" + Math.floor((Math.random() * 6) + 1) + ".png";
            if(i < 1) {
                    clearInterval(test);
                }

            }, 50);     
    }

Jetzt möchte ich auf das setInterval warten, bis es fertig ist. Also habe ich ein setTimeout hinzugefügt.

setTimeout(function(){alert("test")}, (j + 1) * 50);

Dieser Code funktioniert ganz in Ordnung. Aber in meinem Hauptcode dieroleDice() Funktion gibt einen Wert zurück. Jetzt weiß ich nicht, wie ich damit umgehen kann ... Ich kann nicht von der ... zurückkehrensetTimeout(). Wenn ich eine Rückkehr zum Ende der Funktion hinzufüge, wird die Rückkehr zu schnell erhöht. Hat jemand eine Idee, wie ich das beheben könnte?

Bearbeiten Hmm, okay ich verstehe was die Rückrufdosis ist und ich denke ich weiß wie es funktioniert aber ich habe immer noch das Problem. Ich denke, es ist eher ein "Schnittstellen" -Problem ... Hier mein Code:

function startAnimation(playername, callback) {
    var i = Math.floor((Math.random() * 25) + 5);
    var int = setInterval(function() {
        i--;
        var number = Math.floor((Math.random() * 6) + 1);
        document.getElementById("dice").src = "./images/dice/dice" + number + ".png";
        if(i < 1) {
            clearInterval(int);
            number = Math.floor((Math.random() * 6) + 1);
            addText(playername + " rolled " + number);
            document.getElementById("dice").src = "./images/dice/dice" + number + ".png";
            callback(number);
        }
    }, 50);
}

function rnd(playername) {
    var callback = function(value){
        return value; // I knew thats pointless...
    };
    startAnimation(playername, callback);
}

Die Funktionrnd() sollte warten und den Wert zurückgeben ... Ich bin ein bisschen verwirrt. Im Moment habe ich keine Ahnung, wie es weitergeht ... Der Code wartet auf denvar callback... aber wie könnte ich es mit der rückgabe kombinieren? Ich möchte die Animation starten und danach die letzte Nummer mit zurückgebenrnd() zu einer anderen Funktion.

Antworten auf die Frage(4)

Ihre Antwort auf die Frage