Как отложить ответ в игре "Каменные ножницы"

Question

Как отложить ответ в игре "Каменные ножницы"

Я сделал простую игру с ножницами из каменной бумаги с помощью Javascript, я хотел бы сделать задержку до появления результата, я попытался seTimeout() разными способами, но не могу заставить его работать.

Вот мой Javascript

function game(opt) {
var comp = Math.random();
var pers = opt.value;
if (comp < 0.33) {
    comp = "rock"
} else if (comp < 0.66) {
    comp = "paper"
} else {
    comp = "scissors"
}


if (comp == pers) {
    document.getElementById("answer").innerHTML = "Draw, I chose: <b>" + comp+"</b>";
} else if (pers == "rock" && comp == "scissors" || pers == "paper" && comp == "rock" || pers == "scissors" && comp == "paper") {
    document.getElementById("answer").innerHTML = "Well done you won, I chose: <b>" + comp+"</b>";
} else if (pers == "rock" && comp == "paper" || pers == "paper" && comp == "scissors" || pers == "scissors" && comp == "rock") {
    document.getElementById("answer").innerHTML = "Sorry you lose, I chose: <b>" + comp+"</b>";
}

document.getElementById("info").innerHTML = pers+" V "+comp;
};

Вот мой HTML

 <body>
 <div id="alignCenter">


<h1 onclick="rock()" align="center">Rock, Paper, Scissors...</h1>
<h2 align="center">Pick one</h2>


<div id="images">



<button value="rock" id="rock" onclick="game(rock)"> <img src="images/rock.gif" alt="rock"  onclick="rock()" width="196" height="144"> </button>
<button value="paper" id="paper" onclick="game(paper)"> <img src="images/paper.png" alt="paper" onclick="paper()" width="196" height="263"> </button>
<button value="scissors" id="scissors" onclick="game(scissors)"> <img src="images/scissors.png" alt="scissors" width="196" height="200"> </button>

</div>

<div align="center" id="answer">


</div>

Игра работает идеально, я просто хотел бы, чтобы была задержка. Также, если во время задержки есть возможность, чтобы она вспыхнула: "качайте", затем мигайте "бумагу", а затем мигайте "ножницами" около секунды каждый, как я бы сделал это?

Заранее спасибо:)

1

javascript html timing code-timing

Источник

user3023371 22 ноя '13 в 22:56

1 ответ

Решение

Другие вопросы по тегам javascript html timing code-timing

user1022305 22 ноя '13 в 23:00 2013-11-22 23:00 · Accepted Answer · 2013-11-22 23:00

Заверните среднюю часть в setTimeout функция. Я также добавил одну строку кода прямо перед функцией setTimeout, чтобы она очищала предыдущий ответ в ожидании нового результата.

document.getElementById("answer").innerHTML = ""; 
setTimeout(function(){
    if (comp == pers) {
        document.getElementById("answer").innerHTML = "Draw, I chose: <b>" + comp+"</b>";
    } else if (pers == "rock" && comp == "scissors" || pers == "paper" && comp == "rock" || pers == "scissors" && comp == "paper") {
        document.getElementById("answer").innerHTML = "Well done you won, I chose: <b>" + comp+"</b>";
    } else if (pers == "rock" && comp == "paper" || pers == "paper" && comp == "scissors" || pers == "scissors" && comp == "rock") {
        document.getElementById("answer").innerHTML = "Sorry you lose, I chose: <b>" + comp+"</b>";
    }
},1000);