我是一名新手网络开发人员，今天很无聊所以我整理了一个非常奇怪的点击式游戏的草稿。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width">
<title>HYPEBEAST SIMULATOR</title>
<link href="index.css" rel="stylesheet" type="text/css" />
</head>
<body>
<h1>HYPEBEAST CLICKER</h1>
<button id="hypebutton" onclick = "clickButton()">HYPEEEE BUTTONNN</button> Amount of clout: <span id="clout">0</span>
<p><button id="buyjuice" onclick = "buyJuice()">Buy Vape Juice, cost is <span id="juicecost">10</span></button></p>
<script>
var clout = 0;
function clickButton() {
clout = clout + 1;
document.getElementById("clout").innerHTML = clout;
}
var juice = 0;
function buyJuice() {
var juicecost = Math.floor(10 * Math.pow(3.2, juice));
if (clout >= juicecost) {
document.getElementById("juicecost").innerHTML = juicecost;
clout = clout - juicecost;
juice = juice + 0.1;
document.getElementById("clout").innerHTML = clout;
}
}
var nextCost = Math.floor(10 * Math.pow(3.2, juice));
document.getElementById("juicecost").innerHTML = nextCost;
</script>
问题是，当您单击“购买果汁”按钮时，它可以正常运行，并且会从影响力成本中扣除成本，但它不会立即更新值。它仍然表示点击它后成本为10，即使它变为11但未显示。下次单击它时，它会更改为11，即使实际成本为12，依此类推。有什么建议？我大部分时间都是javascript的新手，所以对我很轻松：D
function buyJuice() {
var juicecost = Math.floor(10 * Math.pow(3.2, juice));
if (clout >= juicecost) {
clout = clout - juicecost;
juice = juice + 0.1;
document.getElementById("juicecost").innerHTML = Math.floor(10 * Math.pow(3.2, juice));
document.getElementById("clout").innerHTML = clout;
}
}
重新计算juicecost后在按钮中设置文本
var clout = 0;
function clickButton() {
clout = clout + 1;
document.getElementById("clout").innerHTML = clout;
}
var juice = 0;
function buyJuice() {
var juicecost = Math.floor(10 * Math.pow(3.2, juice));
if (clout >= juicecost) {
clout = clout - juicecost;
juice = juice + 0.1;
document.getElementById("juicecost").innerHTML = Math.floor(10 * Math.pow(3.2, juice));
document.getElementById("clout").innerHTML = clout;
}
}
var nextCost = Math.floor(10 * Math.pow(3.2, juice));
document.getElementById("juicecost").innerHTML = nextCost;
<h1>HYPEBEAST CLICKER</h1>
<button id="hypebutton" onclick = "clickButton()">HYPEEEE BUTTONNN</button>
Amount of clout: <span id="clout">0</span>
<p>
<button id="buyjuice" onclick = "buyJuice()">Buy Vape Juice, cost is <span id="juicecost">10</span></button>
</p>