Question

这是我的代码，如果“Ben”被输入“赢家”框，则尝试获取框“点”以返回pointSum的总和。只是尝试使用这个项目的一些基础知识。试图制作各种各样的支架

<HTLML>
<head>
    <script>
        var pointSum = 0;
        var firstRound = 20;
        var secondRound = 50;
        var thirdRound = 100;
        var fourthRound = 150;
        var fifthRound = 250;
        var finalRound = 300;
        var winnerOne = false;
        var winnerTwo = false;
        var winnerThree = false;
        var winnerFour = false;
        var winnerFive = false;
        var winnerSix = false;

        if (winnerOne = true){
            pointSum+=firstRound
        } else if (winnerTwo = true){
            pointSum+=secondRound
        } else if (winnerThree = true){
            pointSum+=thirdRound        
        } else if (winnerFour = true){
            pointSum+=fourthRound
        } else if (winnerFive = true){
            pointSum+=fifthRound
        } else if (winnerSix = true){
            pointSum+=finalRound
        else 

        function tally() {if document.getElementById('winner') == "Ben" { winnerOne = true;
            }
                    pointSum=document.getElementById("points").value;
        }
    </script>
</head>
<body>
    <form>
        Winner: 
        <input type="text" name="winner" id="winner" size="20">
        Points:
        <input type="text" name="points" id="points" size="20">
        Submit 
        <button type= "button" onclick="tally()">Tally points</button>

    </form>
</body>
</html>

更新*****新代码，变得更好，没有返回控制台错误，但在点击计数时仍未在“点”框中获取任何内容

<HTLML>
<head>
    <script>
        var pointSum = 0;
        var firstRound = 20;
        var secondRound = 50;
        var thirdRound = 100;
        var fourthRound = 150;
        var fifthRound = 250;
        var finalRound = 300;
        var winnerOne = false;
        var winnerTwo = false;
        var winnerThree = false;
        var winnerFour = false;
        var winnerFive = false;
        var winnerSix = false;

        function tally() {
            var winner = document.getElementById("winner").value; 
            var firstWinner = "Ben";
            if (winner == firstWinner){ 
                winnerOne == true;
            }
                pointSum = document.getElementById("points").value;     
        }           

        if (winnerOne == true){
            pointSum+=firstRound;
        } else if (winnerTwo){
            pointSum+=secondRound;
        } else if (winnerThree){
            pointSum+=thirdRound;
        } else if (winnerFour){
            pointSum+=fourthRound;
        } else if (winnerFive){
            pointSum+=fifthRound;
        } else if (winnerSix){ 
            pointSum+=finalRound;
        }
    </script>
</head>
<body>
    <form>
        Winner: 
        <input type="text" name="winner" id="winner" size="20">
        Points:
        <input type="text" name="points" id="points" size="20">
        Submit 
        <button type= "button" onclick="tally()">Tally points</button>

    </form>
    <div class="updatePoints">
    </div>
</body>
</html>

Answer 1

您的代码有一些错误，让我们稍微改变一下！

首先，您需要在if语句中访问wins元素的'value'属性，并在括号中包含所有语句

function tally() {
    if (document.getElementById('winner').value == "Ben"){
        winnerOne = true;
    }
    pointSum = document.getElementById("points").value;
}

其次，使用'=='进行比较，你使用'='，这意味着你赋予变量true，而你忘了把';'在行尾！改变这一部分：

if (winnerOne == true){
     pointSum+=firstRound;
}

把你所有的if / else都像上面的例子一样！

提示：当你使用if语句时，你可以像这样使用：

if (winnerOne){ //you can omit == true, because if winnerOne is true, it will enter ind the if statement
     //will enter here if winnerOne is true
}

if (!winnerOne){ //you can omit == false, because if winnerOne is not true, it will enter ind the if statement
     //will enter here if winnerOne is false
}

Answer 2

在else检查结束时，您还有一个遗留if，这是无效的。您需要使用else if结束最后一个};语句。

你想把文字放在某个地方吗？我没有看到任何处理此问题的代码 - 您可能希望添加一些将更新的HTML：

<div class="updatePoints">
  // leave empty 
</div>

然后，在您的JavaScript中，您始终可以添加一些代码来更新.updatePoints

var points = document.getElementByClass('updatePoints');
points.innerHTML = pointSum.value;

Answer 3

在代码中添加一些行并使用一些注释对其进行修改。可以试试https://jsfiddle.net/8fhwg6ou/。希望可以提供帮助。

<HTLML>
<head>
    <script>
        var pointSum = 0;
        var firstRound = 20;
        var secondRound = 50;
        var thirdRound = 100;
        var fourthRound = 150;
        var fifthRound = 250;
        var finalRound = 300;
        var winnerOne = false;
        var winnerTwo = false;
        var winnerThree = false;
        var winnerFour = false;
        var winnerFive = false;
        var winnerSix = false;

        function tally() {
            var winner = document.getElementById("winner").value; 
            var firstWinner = "Ben";
            if (winner == firstWinner){ 
                winnerOne = true; // Use only one = symbol to assign value, not ==
                pointSum = Number(document.getElementById("points").value); // moved from outside and convert to number

                // This code will update point in Points box
                document.getElementById("points").value = tally_pointsum(pointSum);

                // The codes below will add the text in div, just remove the + sign if you don't like
                document.getElementById("updatePoints").innerHTML += (tally_pointsum(pointSum) - pointSum) + " points added<br />";
            }
        }

        // Wrap codes below become a function, lets call it tally_pointsum:
        function tally_pointsum(pointSum) {
            if (winnerOne == true){
                pointSum+=firstRound;
            } else if (winnerTwo){
                pointSum+=secondRound;
            } else if (winnerThree){
                pointSum+=thirdRound;
            } else if (winnerFour){
                pointSum+=fourthRound;
            } else if (winnerFive){
                pointSum+=fifthRound;
            } else if (winnerSix){ 
                pointSum+=finalRound;
            }
            return pointSum; //return the sum to caller
        }
    </script>
</head>
<body>
<form>
    Winner: 
    <input type="text" name="winner" id="winner" size="20">
    Points:
    <input type="text" name="points" id="points" size="20">
    Submit 
    <button type= "button" onclick="tally()">Tally points</button>

</form>
<!-- change class="updatePoints" to id="updatePoints" for document.getElementById("updatePoints") -->
<div id="updatePoints">
</div>

快乐的编码。

基本的Javascript onclick

3 个答案: