Question

我试图创建一个Html / Js货币计数器但是如果我更新，它会更新一个刻度，然后它会将自身重置为旧值。我尝试创建一个名为update的函数，让它在每次money值改变时运行，但这也不起作用。

stillImageSource

Answer 1

你有多个问题。第一个是每次玩游戏时都提交一个表单，这样页面就会刷新，一切都会丢失。您可以找到一种解决方法来避免这种情况（see this），但在这种情况下，确实不需要表单。

此外，用户总是会赢，因为您始终将flip设置为true。您可以使用以下代码段模拟随机获胜：

var win = Math.round( Math.random() ); // 1 or 0 (truthy or falsy)

这是一个有效的例子：

var balance = 500;

document.getElementById('flip').addEventListener('click', play);

function play(){
    // parseInt() converts a String to an integer (10 is for decimal base)
    var bet = parseInt(document.getElementById('bet').value, 10);

    if(bet <= balance && bet > 0)
    {
        var accepted = confirm("Do you really want to bet " + bet + "$?");
        if(accepted)
        {
            var win = Math.round( Math.random() ); // Random win
            if(win)
            {
                alert("You won " + bet + "$!");
                balance += bet;
            }
            else
            {
                alert("You lost " + bet + "$...");
                balance -= bet;
            }
            if(!balance){ alert('You ran out of money...'); }
            document.getElementById('p1').textContent = "You have " + balance + "$";
        }
        document.getElementById('bet').value = 0;
    }
    else
    {
        alert("Your bet makes no sense!");
    }
}

<p id="p1">You have 500$</p>
<p>Coins: <input type="number" value="0" id="bet"> <button id="flip">Flip the coin</button>

如何在函数中使用inner.HTML？

1 个答案: