JavaScript函数掷硬币函数挑战

Question

JavaScript函数(需要帮助解决问题4)

1. 定义一个模拟抛硬币的函数。在这里写下你的定义。您可以将其保存为名为tossCoin1.txt的文本文件

2. 将第一个函数定义合并到一个模拟抛硬币的程序中。调用该文件tossCoin2.html。每次用户按下"投掷"按钮时，程序都会掷出硬币。这意味着您需要在文档主体中包含表单。在表单的文本输入中显示掷硬币的结果。

3. 修改你刚刚写的程序，把它保存为tossCoin3.html，这样它就可以记录抛硬币的次数，正面出现的次数和反面出现的次数。

4. 再次修改程序，将其保存为tossCoin4.html，以便用户可以输入他们想要投掷硬币的次数。如果他们输入1000，它将投掷硬币1000次，并输出正面出现的次数和反面出现的次数。

<label>How many times do you wat to flip the coin</label>
<input type = "number" id = "tosses" required>
<input type="submit" onsubmit="flipCoin()" value="Flip Coin">
<p> Results:</p>
<p> Heads: <span id="head">0</span></p>
<p> Tails: <span id="tail">0</span></p>

<script>
var tails = 0;
var heads = 0;
var tosses = parseInt(document.getElementById("tosses").value);
function flipCoin(){
while (tosses != 0){
var toss = Math.floor(Math.random() * 2);
tosses--;
if(toss == 0){
heads++;
} else {
tails++;
}

document.getElementById("head").innerHTML = (heads);
document.getElementById("tail").innerHTML = (tails);
}

}//flipCoin()
</script>

Answer 1

这个函数(在另一个用户慈善编辑之后)解决了这个问题…

function flipCoin() {
let tails = 0;
let heads = 0;
let tosses = parseInt(document.getElementById('tosses').value);
//Loop as many times as the tosses
for (var i = 0; i < tosses; i++) {
let toss = Math.random();
if (toss < 0.5) {
heads++;
} else {
tails++;
}
} //for loop
//display results
document.getElementById("head").innerHTML = (heads);
document.getElementById("tail").innerHTML = (tails);
}
document.getElementById('run').addEventListener("click", flipCoin);

Tosses:
<input id="tosses" value="100" style="width:100px" />
<button id="run">Run</button>
<p>Heads: <span id="head"/></p>
<p>Tails: <span id="tail"/></p>