0
私は小さなアイドルゲームを作っています。私の苦労の一部は、すべての数字をカンマで区切ることです（審美的な目的で）。私は通貨、エネルギー、これらのコンマを持って成功しましたが、私は他の変数を追加するのは非常に困難です。私はnum.toLocaleString();とnum.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");メソッドを2回に分けて使いました。不自然なHTML/JSスクリプトの変数未定義エラー
私のJSコード：
var energyDisp = '0';
var energy = 0;
var harvestClickAmt = 1;
var windmills = 0;
var windmillProduction = 1;
var windmillCost = 0;
var wcD = '0'; //Display for Windmill Cost
var solarPanels = 0;
var solarProduction = 3;
var solarCost = 0;
var scD = '0'; // Display for Solar Cost
var dams = 0;
var damProduction = 20;
var damCost = 0;
var dcD = '0'; // Display for Dam Cost
function toCommas(num) {
var c = num.toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
return c;
}
function harvestClick(harvestAmt) {
energy += Math.round(harvestAmt);
energyDisp = toCommas(energy);
document.getElementById('energy').innerHTML = energy;
document.getElementById('energyDisp').innerHTML = energyDisp;
}
function buyWindmill(){
windmillCost = Math.floor(40 * Math.pow(1.14,windmills));
if(energy >= windmillCost){
windmills += 1;
energy -= windmillCost;
document.getElementById('windmills').innerHTML = windmills;
document.getElementById('energy').innerHTML = energy;
};
var nextCost = Math.floor(40 * Math.pow(1.14, windmills));
};
function buySolarPanel(){
solarCost = Math.floor(600 * Math.pow(1.13,solarPanels));
if(energy >= solarCost){
solarPanels += 1;
energy -= solarCost;
harvestClickAmt += 1;
document.getElementById('solarPanels').innerHTML = solarPanels;
document.getElementById('energy').innerHTML = energy;
};
var nextCost = Math.floor(600 * Math.pow(1.13, solarPanels));
document.getElementById('solarCost').innerHTML = nextCost;
toString().replace(/\B(?=(\d{3})+(?!\d))/g, ",");
document.getElementById('harvestClickAmt').innerHTML = harvestClickAmt;
};
function buyDam(){
damCost = Math.floor(5000 * Math.pow(1.126,dams));
if(energy >= damCost){
dams += 1;
energy -= damCost;
windmillProduction *= 1.001;
document.getElementById('dams').innerHTML = dams;
document.getElementById('energy').innerHTML = energy;
};
var nextCost = Math.floor(5000 * Math.pow(1.13, dams));
document.getElementById('damCost').innerHTML = nextCost;
document.getElementById('damProduction').innerHTML = windmillProduction;
};
window.setInterval(function(){
harvestClick((windmillProduction * windmills) +
(solarProduction * solarPanels) +
(damProduction * dams));
toCommas();
document.getElementById('wcD').innerHTML = windmillCost;
document.getElementById('scD').innerHTML = solarCost;
document.getElementById('dcD').innerHTML = damCost;
);
}, 1000);
マイHTML：
<html>
<link rel="stylesheet" type="text/css" href="interface.css" />
<head>
<body>
<button id = "harvest" onclick="harvestClick(5)"></button>
<br />
<span id="energyDisp">0</span> Energy
<br />
<button onclick="buyWindmill()">Buy Windmill</button>
<br />
Windmills: <span id="windmills">0</span>
<br />
Cost: <span id="wcD">40</span> Energy
<br />
<button onclick="buySolarPanel()">Buy Solar Panel</button>
<br />
Increases clicking production by 1 energy.
<br />
Solar Panels: <span id="solarPanels">0</span>
<br />
Cost: <span id="scD">600</span> Energy
<br />
<button onclick="buyDam()">Buy Dam</button>
<br />
Increases windmill production by 0.1% per dam.
<br />
Dams: <span id="dams">0</span>
<br />
Cost: <span id="dcD">5,000</span> Energy
<script type="text/javascript" src="main.js"></script>
</body>
</head>
</html>
私の問題？ゲーム内のテキストは更新されていません。 https://gyazo.com/c4b0df8453aa79f7db44655e7f7daf91
キャッチされない例外TypeError：main.jsで ：79
27行：document.getElementById('energy').innerHTML = energy;
だから私はこのコンソールエラーを受け取っている理由と、カンマフォーマットを多くの変数に一度に適用してライブを更新する方法（ゲームが実行されているとき）に両方の回答を希望します。 ありがとうございました！
あなたが投稿したマークアップには、 'id =" energy "'があり、 'getElementById（ 'energy'）'と一致する要素は含まれていません。 –