按下时按钮不执行任何操作

时间:2017-07-31 00:53:31

标签: javascript

我一直在研究我自己的项目,我正在努力添加另一个按钮。现在我的设置与其他设置非常相似,但是当它没有工作时我按它。对于我的代码,firstx2,secondx2和第一个构建按钮都可以正常工作,但是当你尝试点击第二个构建按钮时,它什么也没做。我可能做了一个小错字或错过了一条线,但我似乎无法在任何地方找到它。要进入第二个建筑物按钮,您必须已经点击了两个乘数和第一个建筑物。谢谢你的帮助!

    <!DOCTYPE html>
<html>
<body>

<p>Click to get started!</p>

<button onclick="addPoints()">Add points</button>

<button id="btn_multiply" onclick="firstx2()" style="display:none;">x2 Multiplier. Cost: 100</button>

<button id="firstbuild" onclick="build1()" style="display:none;">Building 1. Cost x</button>

<button id="multiply2" onclick="secondx2()" style="display:none;">x2 Multiplier. Cost: 1000</button>

<button id="secondbuild" onlcick="build2()" style="display:none;">Building 2. Cost x</button>
<script>

var points = 10099;
var pointMulti = 1;
var buyupgrade = 0;
var b1cost = 200;
var b1count = 0;
var b2cost = 1000;
var b2count = 0;
var currentpoints = setInterval(pointupdate, 500);

function addPoints() {
    points += pointMulti;
    var pointsArea = document.getElementById("pointdisplay");
    pointsArea.innerHTML = "You have " + Math.round(points) + " points!";
        if(points >= 100 && buyupgrade == 0) {
        var multiply_button = document.getElementById("btn_multiply");
        multiply_button.style.display = "inline";
    }
}
  
function firstx2() {
  if (buyupgrade == 0) {
    pointMulti *= 2;
    buyupgrade++;
    points -= 100;
    var multiplierArea = document.getElementById("multidisplay");
    multiplierArea.innerHTML = "Your multiplier is: " + pointMulti;
    var multiply_button = document.getElementById("btn_multiply");
    multiply_button.style.display = "none";
    
    
   if (buyupgrade == 1) {
    var firstbuild = document.getElementById("firstbuild");
    firstbuild.style.display = "inline";
    firstbuild.innerText = "Building 1. Cost " + b1cost;
    
    var show2ndx2 = document.getElementById("secondx2");
    multiply2.style.display = "inline";
}

  }
}

function pointupdate() {
  document.getElementById("pointdisplay").innerHTML = "You have " + Math.round(points) + " points!";
}

function build1() {
  if (points >= b1cost) {
    points -= b1cost;
    b1count++;
    b1cost *= 1.10;
    document.getElementById("b1").innerHTML = "You have " + b1count + " of building 1!"
    firstbuild.innerText = "Building 1. Cost " + Math.round(b1cost);
    var build1add = setInterval(build1points, 1000);
    var secondbuild = document.getElementById("secondbuild");
    secondbuild.style.display = "inline";
    secondbuild.innerText = "Building 2. Cost " + b2cost;
    
  }
}

function build2() {
  if (points >= b2cost) {
    points -= b2cost;
    b2count++;
    b2cost *= 1.10;
    document.getElementById("b2").innerHTML = "You have " + b2count + " of building 2!"
    secondbuild.innerText = "Building 2. Cost " + Math.round(b2cost);
    var build2add = setInterval(build2points, 1000);
  }
}

function build1points() {
  points += 1;
}

function build2points() {
  points += 4;
}

function secondx2() {
  if (buyupgrade == 1 && points >= 1000) {
    pointMulti *= 2;
    points -= 1000;
    document.getElementById("multidisplay").innerHTML = "Your multiplier is: " + pointMulti;
    multiply2.style.display = "none";
  }
}
</script>

<p id="pointdisplay"></p>
<p id="multidisplay"></p>
<p id="b1"></p>
<p id="b2"></p>
</body>
</html>

3 个答案:

答案 0 :(得分:0)

onclick

中的<button id="secondbuild" onlcick="build2()" style="display:none;">Building 2. Cost x</button>不应该是onlcick

&#13;
&#13;
    <!DOCTYPE html>
<html>
<body>

<p>Click to get started!</p>

<button onclick="addPoints()">Add points</button>

<button id="btn_multiply" onclick="firstx2()" style="display:none;">x2 Multiplier. Cost: 100</button>

<button id="firstbuild" onclick="build1()" style="display:none;">Building 1. Cost x</button>

<button id="multiply2" onclick="secondx2()" style="display:none;">x2 Multiplier. Cost: 1000</button>

<button id="secondbuild" onclick="build2()" style="display:none;">Building 2. Cost x</button>
<script>

var points = 10099;
var pointMulti = 1;
var buyupgrade = 0;
var b1cost = 200;
var b1count = 0;
var b2cost = 1000;
var b2count = 0;
var currentpoints = setInterval(pointupdate, 500);

function addPoints() {
    points += pointMulti;
    var pointsArea = document.getElementById("pointdisplay");
    pointsArea.innerHTML = "You have " + Math.round(points) + " points!";
        if(points >= 100 && buyupgrade == 0) {
        var multiply_button = document.getElementById("btn_multiply");
        multiply_button.style.display = "inline";
    }
}
  
function firstx2() {
  if (buyupgrade == 0) {
    pointMulti *= 2;
    buyupgrade++;
    points -= 100;
    var multiplierArea = document.getElementById("multidisplay");
    multiplierArea.innerHTML = "Your multiplier is: " + pointMulti;
    var multiply_button = document.getElementById("btn_multiply");
    multiply_button.style.display = "none";
    
    
   if (buyupgrade == 1) {
    var firstbuild = document.getElementById("firstbuild");
    firstbuild.style.display = "inline";
    firstbuild.innerText = "Building 1. Cost " + b1cost;
    
    var show2ndx2 = document.getElementById("secondx2");
    multiply2.style.display = "inline";
}

  }
}

function pointupdate() {
  document.getElementById("pointdisplay").innerHTML = "You have " + Math.round(points) + " points!";
}

function build1() {
  if (points >= b1cost) {
    points -= b1cost;
    b1count++;
    b1cost *= 1.10;
    document.getElementById("b1").innerHTML = "You have " + b1count + " of building 1!"
    firstbuild.innerText = "Building 1. Cost " + Math.round(b1cost);
    var build1add = setInterval(build1points, 1000);
    var secondbuild = document.getElementById("secondbuild");
    secondbuild.style.display = "inline";
    secondbuild.innerText = "Building 2. Cost " + b2cost;
    
  }
}

function build2() {
  if (points >= b2cost) {
    points -= b2cost;
    b2count++;
    b2cost *= 1.10;
    document.getElementById("b2").innerHTML = "You have " + b2count + " of building 2!"
    secondbuild.innerText = "Building 2. Cost " + Math.round(b2cost);
    var build2add = setInterval(build2points, 1000);
  }
}

function build1points() {
  points += 1;
}

function build2points() {
  points += 4;
}

function secondx2() {
  if (buyupgrade == 1 && points >= 1000) {
    pointMulti *= 2;
    points -= 1000;
    document.getElementById("multidisplay").innerHTML = "Your multiplier is: " + pointMulti;
    multiply2.style.display = "none";
  }
}
</script>

<p id="pointdisplay"></p>
<p id="multidisplay"></p>
<p id="b1"></p>
<p id="b2"></p>
</body>
</html>
&#13;
&#13;
&#13;

答案 1 :(得分:0)

我认为你应该检查你的按钮(secondbuild)

关键字onclick错误

答案 2 :(得分:0)

拼写错误。 onclick not oncilck。

<button id="secondbuild" onlcick="build2()" style="display:none;">Building 2. Cost x</button> <script>