javascript - javascript 中的两人石头剪刀布

Question

当我在玩一些 javascript 时，我想“让我们做一个简单的游戏吧!”
所以我开始了，现在我陷入困境，我需要你的帮助:p
这就是我制定的“计划”:

1. 询问 user1 的姓名var name1 =prompt("你叫什么名字？");
2. 询问用户2的姓名var name2 =提示(“你叫什么名字？”);
3. 询问 user1 的选择var user1 =prompt("石头、剪刀、布");
4. 询问用户2的选择var user2 =提示(“石头、剪刀、布”);

5. 显示他们的选择:

   if (user1 === "rock") {
       document.write("<b>rock</b>");
   } else if (user1 === "scissors") {
       document.write("<b>scissors</b>");
   } else if (user1 === "paper") {
       document.write("<b>paper</b>");
   } else {
       alert("DUDE THAT AINT NO OPTION YO");
   }
   
   document.write(" vs ");
   
   if (user2 === "rock") {
       document.write("<b>rock</b>");
   } else if (user2 === "scissors") {
       document.write("<b>scissors</b>");
   } else if (user2 === "paper") {
       document.write("<b>paper</b>");
   } else {
       alert("DUDE THAT AINT NO OPTION YO");
   }
   
   document.write(" = ");
   

6. 计算结果:

   if (user1 === user2) {
       document.write("tie, try again!");
   }
   
   if (user1 === "rock") {
       if (user2 === "scissors") {
           document.write("yay " + name1 + "<b> wins!</b>");
       } else if (user2 === "rock") {
           document.write("tie...");
       } else {
           document.write("yay " + name2 + "<b> wins!</b>");
       }
   } else if (user1 === "paper") {
       if (user2 === "rock") {
           document.write("yay " + name1 + "<b> wins!</b>");
       } else if (user2 === "rock") {
           document.write("yay " + name2 + "<b> wins!</b>");
       } else {
           document.write("tie...");
       }
   } else if (user1 === "scissors") {
       if (user2 === "scissors") {
           document.write("tie...");
       } else if (user2 === "paper") {
           document.write("yay " + name1 + "<b> wins!</b>");
       } else {
           document.write("yay " + name2 + "<b> wins!</b>");
       }
   } else {
       document.write("wut");
   }
   

7. 这是我遇到困难的地方:我想创建一个从步骤 3 重新启动的按钮。步骤 1 和 2 不得重复!我该怎么做？

提前致谢!

(上面的代码可能很困惑^所以这里是jsfiddle链接:http://jsfiddle.net/robinvandernoord/c0n2wuuf/)

PS:我应该使用 document.write 还是其他东西？
//更新我用alert()代替，在我看来它更好。

Answer 1

首先，我会将主要游戏部分(除了询问名称之外的所有内容)放入一个函数中。这将让您只需调用该函数即可玩另一个游戏。

要询问他们是否想玩，您可以使用 confirm框询问他们。这将返回 true 或 false。只需将其放在函数末尾，如果单击“确定”，则再次调用该函数:

function playGame()
{
    var user1 = prompt("rock, paper, scissors");
    var user2 = prompt("rock, paper, scissors");
    if (user1 === "rock") {
        document.write("<b>rock</b>");
    } else if (user1 === "scissors") {
        document.write("<b>scissors</b>");
    } else if (user1 === "paper") {
        document.write("<b>paper</b>");
    } else {
        alert("DUDE THAT AINT NO OPTION YO");
    }
    
    document.write(" vs ");
    
    if (user2 === "rock") {
        document.write("<b>rock</b>");
    } else if (user2 === "scissors") {
        document.write("<b>scissors</b>");
    } else if (user2 === "paper") {
        document.write("<b>paper</b>");
    } else {
        alert("DUDE THAT AINT NO OPTION YO");
    }
    
    document.write(" = ");
    
    if (user1 === user2) {
        document.write("tie, try again!");
    }
    
    if (user1 === "rock") {
        if (user2 === "scissors") {
            document.write("yay " + name1 + "<b> wins!</b>");
        } else if (user2 === "rock") {
            document.write("tie...");
        } else {
            document.write("yay " + name2 + "<b> wins!</b>");
        }
    } else if (user1 === "paper") {
        if (user2 === "rock") {
            document.write("yay " + name1 + "<b> wins!</b>");
        } else if (user2 === "rock") {
            document.write("yay " + name2 + "<b> wins!</b>");
        } else {
            document.write("tie...");
        }
    } else if (user1 === "scissors") {
        if (user2 === "scissors") {
            document.write("tie...");
        } else if (user2 === "paper") {
            document.write("yay " + name1 + "<b> wins!</b>");
        } else {
            document.write("yay " + name2 + "<b> wins!</b>");
        }
    } else {
        document.write("wut");
    }
    
    var playAgain = confirm("Play Again?");
    if(playAgain) {
        // just run the game again
        playGame();
    }
}

// ask for their names
var name1 = prompt("what is your name?");
var name2 = prompt("what is your name?");

// run the first game
playGame();

下一步是将提示移至 <input>屏幕上的元素，因为弹出的提示可怕。