Question

我在JavaScript末尾的警报不起作用，我也不知道为什么。我认为我已正确串联，但是我不知道为什么代码到达警报时不执行任何操作。

以下是HTML的代码：

<head>

    <meta charset="utf-8">

    <link rel="stylesheet" href="css/style.css">

    <title>Play Battleship Free Online!</title>

</head>

<body>

    <h1>Play Battleship!</h1>

    <script src="battleship.js"></script>

    <button onclick="startGame()">Play!</button>

</body>

这是CSS的代码（可能不需要）：

body {
    font-family: sans-serif;
    text-align: center;
    background-color: mediumseagreen;
}

h1 {
    margin-top: 48px;
    margin-bottom: 48px;
    color: black;

}

这是我的JavaScript的代码：

var randomLoc = Math.floor(Math.random() * 5);
var location1 = randomLoc;
var location2 = location1 + 1;
var location3 = location2 + 1;

var guess;
var hits = 0;
var guesses = 0;
var isSunk = false;

function startGame() {
    while (isSunk == false){
        guess = prompt("Ready, aim, fire! (Enter a number between 1 and 6): ")
        if (guess < 0 || guess > 6){
            alert("Please enter a valid number!");
        }else{
            guesses = guesses + 1;
        }

        if (guess == location1 || guess == location2 || guess == location3) {
            hits++;
            alert("HIT!");
        } if (hits == 3) {
            isSunk = true;
            alert("You sank my battleship!");
        } else {
            alert("MISS!");
        }
    }

    var stats = "You took " + guesses + "guesses to sink the battleship, " + "which means your shooting accuracy was " + (3/guesses);

    alert(stats);

    return;
}

任何帮助表示赞赏。

Answer 1

我在您的JavaScript代码中发现了一些错误，请参见以下注释：

var randomLoc = Math.floor(Math.random() * 5);
var location1 = randomLoc;
var location2 = location1 + 1;
var location3 = location2 + 1;

var guess;
var hits = 0;
var guesses = 0;
var isSunk = false;

function startGame() {
    while (isSunk == false){
        guess = prompt("Ready, aim, fire! (Enter a number between 1 and 6): ")
        if (guess < 0 || guess > 6){
            alert("Please enter a valid number!");
        }else{
            guesses = guesses + 1;
        }

        if (guess == location1 || guess == location2 || guess == location3) {
            hits == hits + 1;
            alert("HIT!");
        } if (hits == 3) {
            isSunk = true;
            alert("You sank my battleship!");

            // Missing a closing curly brace
            else {
                alert("MISS!");
            }
        } // End of while-loop
    } // End of startGame()

startGame（）之外：

    var stats = "You took " + guesses + "guesses to sink the battleship, " + "which means your shooting accuracy was " + (3/guesses);

    alert(stats);

    return;
}

Answer 2

您的JavaScript代码中的主要问题，请检查以下内容：

var randomLoc = Math.floor(Math.random() * 5);
var location1 = randomLoc;
var location2 = location1 + 1;
var location3 = location2 + 1;
var guess;
var hits = 0;
var guesses = 0;
var isSunk = false;
function startGame() {
 while (isSunk == false) {
  guess = prompt("Ready, aim, fire! (Enter a number between 1 and 6): ")
  if (guess < 0 || guess > 6) {
   alert("Please enter a valid number!");
  } else {
   guesses = guesses + 1;
  }

  if (guess == location1 || guess == location2 || guess == location3) {
   hits == hits + 1;
   alert("HIT!");
  }
  if (hits == 3) {
   isSunk = true;
   alert("You sank my battleship!");
  } else {
   alert("MISS!");
  }
 }


 var stats = "You took " + guesses + "guesses to sink the battleship, " + "which means your shooting accuracy was " + (3 / guesses);
 alert(stats);
 return;
}

body {
    font-family: sans-serif;
    text-align: center;
    background-color: mediumseagreen;
}

h1 {
    margin-top: 48px;
    margin-bottom: 48px;
    color: black;

}

<h1>Play Battleship!</h1>
<button onclick="startGame()">Play!</button>

Answer 3

FTFY。

一些注意事项：

Math.random生成一个介于0和1之间的数字，包括0但不包括1。在原始代码中，您编写了Math.random() * 5。这将得到一个从0到5的数字，但不包括5。将这个数字作为底数将使您从0到4。因此，location1可能会得到0的值。这可能是不希望的。
正确的代码格式很重要。在“ Hit” /“ Miss” /“ Sank”代码块中，else应该与“ Hit”块匹配，但是由于格式化，它错误地与“ Sank”块匹配。格式使它很难被发现。
对于布尔变量检查，最好仅在您的条件下使用变量而不使用比较运算符。 while (isSunk == false)最好写成while (!isSunk)。您不必担心会弄混双等号，而且更易于阅读。实际上，在您的代码中，您甚至不需要标志。 while (hits < 3)同样有效。
少量声明全局变量。在您的示例中，最好将变量放入startGame方法中。这样就可以将变量本地化到使用它们的位置，同时还具有单击“播放”时能够“重新启动游戏”的其他好处！按钮第二次。

function startGame() {
    // Randomly generate a number between 0 to 3, and 
    // add 1, 2, 3 to it to get 1 to 6.
    var randomLoc = Math.floor(Math.random() * 4);
    var location1 = randomLoc + 1;
    var location2 = location1 + 1;
    var location3 = location2 + 1;

    var guess;
    var hits = 0;
    var guesses = 0;
    var isSunk = false;

    while (!isSunk){
        guess = prompt("Ready, aim, fire! (Enter a number between 1 and 6): ")
        if (guess < 0 || guess > 6){
            alert("Please enter a valid number!");
        } else {
            guesses = guesses + 1;
        }

        if (guess == location1 || guess == location2 || guess == location3) {
            hits++;
            alert("HIT!");

            if (hits == 3) {
                isSunk = true;
                alert("You sank my battleship!") 
            }
        } else {
            alert("MISS!");
        }             
    }
    var stats = "You took " + guesses + " guesses to sink the battleship, " + "which means your shooting accuracy was " + (3/guesses);    
    alert(stats);    
    return; //Optional
}

body {
    font-family: sans-serif;
    text-align: center;
    background-color: mediumseagreen;
}

h1 {
    margin-top: 48px;
    margin-bottom: 48px;
    color: black;

}

<html>
    <head>    
        <meta charset="utf-8">    
        <link rel="stylesheet" href="css/style.css">    
        <title>Play Battleship Free Online!</title>    
    </head>

    <body>    
        <h1>Play Battleship!</h1>    
        <script src="battleship.js"></script>    
        <button onclick="startGame()">Play!</button>    

    </body>
</html>

警报不起作用

3 个答案: