0から100までのランダムな数字を2つ掛け算し、
結果を5秒後に表示するというもの。
multiplierはすぐには実行せず、executeの中でコールバックされています。
JavaScript
function multiplier(num1,num2){
document.getElementById("answer").innerHTML = "The answer:" + num1*num2;
}
function executor(num1,num2){
document.getElementById("answer").innerHTML = "";
num1 = Math.round(Math.random()* 100);
num2 = Math.round(Math.random()* 100);
document.getElementById("number1").innerHTML = "Random number1: " + num1;
document.getElementById("number2").innerHTML = "Random number2: " + num2;
setTimeout(multiplier, 5000, num1 ,num2);
};
HTML
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<title>set timepout_retry</title>
</head>
<body>
<h1>Multiply five seconds later</h1>
<form>
<input type="button" value = "start!" onclick="executor();"><br>
<p id="number1"></p>
<p id="number2"></p>
<br><br>
<p id="answer"></p>
</form>
<script type="text/javascript" src="settimeout_retry.js"></script>
<noscript>JavaScript is unavaiable</noscript>
</body>
</html>
最初うまく動かなかったのですが、
multiplierをexecuteの引数としてわたしていたのですが、
multiplierが初期化されてしまっていたことが原因でした。