Im trying to make a basic clicker game on JS. But theres a problem.
I tried to make a 2x clicker thing which is the game will ask you if you wanna buy 2x clicker when you reached to 100 clicks. 2x clicks will basically give you 2x clicks.
However i think it broked the entire code since click button is not giving any clicks.
Heres the codes:
JS:
let clickCount = 0;
let clickBoost = false;
document.getElementById("clickButton").onclick = function(){
clickCount +=1;
document.getElementById("clickCounter").innerHTML = clickCount;
if (clickCount += 100){
let boostyorn = prompt("You have more clicks than 100." + "\n" + "\n" + "Do you wanna buy 2x Clicks?" + "\n" + "(Y/N)")
if (boostyorn == "Y"){
document.getElementById("clickCounter").innerHTML = clickCount - 100;
clickBoost = true;
}
else{
alert("You didn't bought 2x Clicks.")
}
}
if (clickBoost == true) {
document.getElementById("clickButton").onclick = function () {
clickCount += 2;
document.getElementById("clickCounter").innerHTML = clickCount;
}
}
}
HTML:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Clicker</title>
<link rel="stylesheet" href="style.css">
</head>
<body>
<label id= "clickCounter">0</label><br>
<center><button id= "clickButton">Click</button></center>
<label id= "clickBoost"
<script src="index.js"></script>
</body>
</html>
CSS:
#clickCounter{
display: block;
text-align: center;
font-size: 150px;
}
#clickButton{
display: block;
text-align: center;
font-size: 100px;
}
okay, there are two mistakes I can find. The first one which will fix your general problem is a missing } at the end of your code.
the second problem ("mistake") is your reset of your clickcount. so far i understand you want to set it to zero right. so therefore you either set the variable to zero after the user answered "Y" or you substract 100 before assigning it to your innerHTML.
let clickCount = 0;
let clickBoost = false;
document.getElementById("clickButton").onclick = function(){
clickCount +=1;
document.getElementById("clickCounter").innerHTML = clickCount;
if (clickCount === 100){
let boostyorn = prompt("You have more clicks than 100." + "\n" + "\n" + "Do you wanna buy 2x Clicks?" + "\n" + "(Y/N)")
if (boostyorn == "Y"){
clickCount = clickCount - 100;
document.getElementById("clickCounter").innerHTML = clickCount;
clickBoost = true;
}
else{
console.log("You didn't bought 2x Clicks.")
}
}
if (clickBoost == true) {
document.getElementById("clickButton").onclick = function () {
clickCount += 2;
document.getElementById("clickCounter").innerHTML = clickCount;
}
}
}