javascript - 石头、布、剪刀、蜥蜴、史波克-6ren

javascript - 石头、布、剪刀、蜥蜴、史波克

转载作者：行者123 更新时间：2023-12-03 08:17:51

我做错了什么？代码的前 2 部分有效，当它可以链接到 jpg 时图片就会显示，但我也希望屏幕显示谁获胜。

<html> <body>
<html>
<H1>Choose Wisely...</H1>
<img src="RockPaperScissorsLizardSpock2.jpg" id="bg" alt="">

<title>Rock, Paper, Scissors, Lizard, Spock</title> 
</head>
<body>
<h2><p>Your Choice:</p>
<form action="form_action.asp">
  <input type="radio" name="userchoice" id="Rock" onclick="myFunction(this.value)" >Rock<br>
  <input type="radio" name="userchoice" id="Paper" onclick="myFunction(this.value)" >Paper<br>
  <input type="radio" name="userchoice" id="Scissors" onclick="myFunction(this.value)" >Scissors<br>
  <input type="radio" name="userchoice" id="Lizard" onclick="myFunction(this.value)" >Lizard <br>
  <input type="radio" name="userchoice" id="Spock" onclick="myFunction(this.value)" >Spock<br><br>
</form>

<h2> Computer Choice: <p id="computer"></p>
<p id="compare"></p></h2>

<script>
function myFunction() {
    var computer = Math.floor((Math.random() * 5)+1); 
    if (computer == 1) {computer = "Rock";
}
else if (computer == 2) {computer = "Paper";
}
else if (computer == 3) {computer = "Scissors";
}
else if (computer == 4) {computer = "Lizard";
}
else if (computer == 5) {computer = "Spock";
}
    document.getElementById("computer").innerHTML = computer;}
</script>
<script>
var compare = function (choice1,choice2);
{
    if (choice1 === choice2)
    {
        result "Draw, try again!";
    }
    else
    {
        if(choice1 === "Rock")
        {
            if(choice2 === "Paper")
            {
            result ("Paper covers Rock. You lose.");
        }
        else if(choice2 === "Scissors")
        {
            result ("Rock crushes Scissors. You win.");
        }
        else if(choice2 === "Lizard")
        {
            result ("Rock smashes Lizard. You win.");
        }
        else if(choice2 === "Spock")
        {
            result ("Spock vaporizes Rock. You lose.");
        }
    }
    }
    else
    {
    if(choice1 === "Paper")
        {
        if(choice2 === "Rock")
        {
           return "Paper covers Rock. You Win.";
        }
        else if(choice2 === "Scissors")
        {
            return "Scissors cut Paper. You lose.";
        }
        else if(choice2 === "Lizard")
        {
            return "Lizard eats Paper. You lose.";
        }
        else if(choice2 === "Spock")
        {
            return "Paper disproves Spock. You Win.";
        }
    }
    }
    else
    {
        if(choice1 === "Scissors")
        {
        if(choice2 === "Rock")
        {
           return "Rock beats Scissors. You lose.";
        }
        if(choice2 === "Paper")
        {
           return "Scissors cut Paper. You win.";
        }
        else if(choice2 === "Lizard")
        {
            return "Scissors decapitate Lizard. You win.";
        }
        else if(choice2 === "Spock")
        {
            return "Spock smashes Scissors. You lose.";
        }
    }
    }
    else
    {
        if(choice1 === "Lizard")
        {
        if(choice2 === "Rock")
        {
           return "Rock smashes Lizard. You lose.";
        }
        if(choice2 === "Paper")
        {
           return "Lizard eats Paper. You win.";
        }
        else if(choice2 === "Scissors")
        {
            return "Scissors decapitate Lizard. You lose.";
        }
        else if(choice2 === "Spock")
        {
            return "Lizard poisons Spock. You win.";
        }
    }
    }
    else
    {
        if(choice1 === "Spock")
        {
        if(choice2 === "Rock")
        {
           return "Spock vaporizes Rock. You win.";
        }
        if(choice2 === "Paper")
        {
           return "Paper disproves Spock. You lose.";
        }
        else if(choice2 === "Lizard")
        {
            return "Lizard poisons Spock. You lose.";
        }
        else if(choice2 === "Scissors")
        {
            return "Spock smashes Scissors. You win.";
        }
                }
                }
                };
    compare(id,computer);

我已经尝试过console.log(compare(id,computer))和document.getElementById("compare").innerHTML = compare;}都不起作用

还尝试将 id 更改为整数并添加

function myFunction(myText) {
    if computer == 1 and id == 1{
        document.getElementById("myText").value = "Rock vs Rock, Stalemate!"}
    else if computer == 1 and id == 2{
        document.getElementById("myText").value = "Paper Covers Rock,Loser!"}
    else if computer == 1 and  id == 3{
        document.getElementById("myText").value = "Rock Crushes Scissors, Winner!"}
    else if computer == 1 and id == 4{
        document.getElementById("myText").value = "Rock Crushes Lizard, Winner!"}
    else if computer == 1 and  id == 5{
        document.getElementById("myText").value = "Spock Vaporizes Rock, Loser!"}
}
</script>

最佳答案

Plunkr Demo

大多数信息都添加在代码下面的注释中。

您的代码存在多个问题，主要是您处理 else if 的方式。请注意，下面的代码写得仍然很差，可以优化。

您还调用了 compare(id, computer) 但 id 未定义。此外，您还传递了单选按钮的 this.value onclick，但这不起作用，因为所有这些按钮的值都是 on，这会更改为 this.id 下面，因为它将传递预期值。

HTML

<!DOCTYPE html>
<html>

<head>
  <link rel="stylesheet" href="style.css">
  <script src="script.js"></script>
  <title>Rock, Paper, Scissors, Lizard, Spock</title>
</head>

<body>
  <!-- moved from head to body -->
  <H1>Choose Wisely...</H1>
  <!-- moved from head to body -->
  <img src="RockPaperScissorsLizardSpock2.jpg" id="bg" alt="">
  <!-- changed <p> to <div> added </h2> to the end -->
  <h2><div>Your Choice:</div></h2>
  <form action="form_action.asp">
    <input type="radio" name="userchoice" id="Rock" value="1" onclick="myFunction(this.id)">Rock
    <br>
    <input type="radio" name="userchoice" id="Paper" value="2" onclick="myFunction(this.id)">Paper
    <br>
    <input type="radio" name="userchoice" id="Scissors" value="3" onclick="myFunction(this.id)">Scissors
    <br>
    <input type="radio" name="userchoice" id="Lizard" value="4" onclick="myFunction(this.id)">Lizard
    <br>
    <input type="radio" name="userchoice" id="Spock" value="5" onclick="myFunction(this.id)">Spock
    <br>
    <br>
  </form>

  <!-- changed <p> to <div> -->
  <h2>Computer Choice: <div id="computer"></div>
<div id="compare"></div></h2>
</body>

</html>

// Code goes here

function myFunction(value) {
  var computer = Math.floor((Math.random() * 5) + 1);
  if (computer == 1) {
    computer = "Rock";
  } else if (computer == 2) {
    computer = "Paper";
  } else if (computer == 3) {
    computer = "Scissors";
  } else if (computer == 4) {
    computer = "Lizard";
  } else if (computer == 5) {
    computer = "Spock";
  }

  document.getElementById("computer").innerHTML = computer;
  //added compare call and updating the innerHTML of the compare id DOM object
  document.getElementById("compare").innerHTML = compare(value, computer);
}

var compare = function(choice1, choice2) {
  if (choice1 === choice2) {
    // changed to return
    return "Draw, try again!";
  } 
  //changed to else if instead of else {
  else if (choice1 === "Rock") {
    if (choice2 === "Paper") {
      return "Paper covers Rock. You lose.";
    } else if (choice2 === "Scissors") {
      return "Rock crushes Scissors. You win.";
    } else if (choice2 === "Lizard") {
      return "Rock smashes Lizard. You win.";
    } else if (choice2 === "Spock") {
      return "Spock vaporizes Rock. You lose.";
    }
  } 
  //changed to else if instead of else {
  else if (choice1 === "Paper") {
    if (choice2 === "Rock") {
      return "Paper covers Rock. You Win.";
    } else if (choice2 === "Scissors") {
      return "Scissors cut Paper. You lose.";
    } else if (choice2 === "Lizard") {
      return "Lizard eats Paper. You lose.";
    } else if (choice2 === "Spock") {
      return "Paper disproves Spock. You Win.";
    }
  }
  //changed to else if instead of else {
  else if (choice1 === "Scissors") {
    if (choice2 === "Rock") {
      return "Rock beats Scissors. You lose.";
    }
    //changed to else if instead of if {
    else if (choice2 === "Paper") {
      return "Scissors cut Paper. You win.";
    } else if (choice2 === "Lizard") {
      return "Scissors decapitate Lizard. You win.";
    } else if (choice2 === "Spock") {
      return "Spock smashes Scissors. You lose.";
    }
  }
  //changed to else if instead of else {
  else if (choice1 === "Lizard") {
    if (choice2 === "Rock") {
      return "Rock smashes Lizard. You lose.";
    }
    //changed to else if instead of if {
    else if (choice2 === "Paper") {
      return "Lizard eats Paper. You win.";
    } else if (choice2 === "Scissors") {
      return "Scissors decapitate Lizard. You lose.";
    } else if (choice2 === "Spock") {
      return "Lizard poisons Spock. You win.";
    }
  } 
  //changed to else if instead of else {
  else if (choice1 === "Spock") {
    if (choice2 === "Rock") {
      return "Spock vaporizes Rock. You win.";
    }
    //changed to else if instead of if {
    else if (choice2 === "Paper") {
      return "Paper disproves Spock. You lose.";
    } else if (choice2 === "Lizard") {
      return "Lizard poisons Spock. You lose.";
    } else if (choice2 === "Scissors") {
      return "Spock smashes Scissors. You win.";
    }
  }
}

关于javascript - 石头、布、剪刀、蜥蜴、史波克，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/33862412/

文章推荐： php - PHP 中的中国对应时区是多少？

文章推荐： python - 如何将 Traceback 错误信息保存到文件中

文章推荐： python - OpenCV 中保存的 webp 图像比 jpg 大 3 倍

javascript - 石头、布、剪刀、蜥蜴、史波克
已关闭。此问题不符合Stack Overflow guidelines 。目前不接受答案。已关闭 7 年前。此问题是由拼写错误或无法再重现的问题引起的。虽然类似的问题可能是 on-topic在这里
android - 开发石头、布、剪刀、蜥蜴、斯波克问题
我今天一直在开发这个应用程序，但我似乎无法弄清楚代码有什么问题。当我检查时，没有语法错误。但是当我尝试运行它并调试它时，它说 "Source not found" on "ActivityThrea
javascript - 为什么我玩石头、剪子、布、蜥蜴、史波克时没有说我赢了？
关闭。此题需要details or clarity 。目前不接受答案。想要改进这个问题吗？通过 editing this post 添加详细信息并澄清问题. 已关闭 8 年前。 Improve th
java - 使用Java Swing GUI制作石头、剪刀、布、蜥蜴、斯波克
我正在尝试使用 Java 的 Swing UI 开发石头、剪刀、布、蜥蜴、spock 的版本。我已经成功地创建了框架来选择玩家 1 和玩家 2，以及游戏获胜的规则(3 局中最好的 2 局，玩到退出，单
android - 石头，布，剪刀，蜥蜴，史波克 Android 应用程序
我今天一直在开发这个应用程序，但我似乎无法弄清楚代码有什么问题。当我检查时，没有语法错误。但是当我尝试运行它并调试它时，它说 “ActivityThread.performLaunchActivit
javascript - 石头、布、剪刀、蜥蜴、spock javascript/html 游戏
我想制作《生活大爆炸》中的石头、布、剪刀、蜥蜴、史波克游戏。我在html中使用了javascript来制作它。 Lets start! You chose: Your frie
python - gui python 中的岩石、布、剪刀、蜥蜴、spock 游戏
from tkinter import * import random class Application(Frame): """A Gui Application for a game.""
javascript - 石头、布、剪刀、蜥蜴、Spock 在 JavaScript 中
我是 JavaScript 的新手。我刚开始学习它，我决定制作一款“石头、剪刀、蜥蜴、史波克”游戏。这是代码: var userChoice = prompt("Do you choose rock,
c++ - 卡在 C++ 石头/布/剪刀/蜥蜴/spock 游戏的 do while 循环中 - 未声明的标识符
我被困在一些我知道应该很容易修复的事情上，但我就是想不通我一直在谷歌搜索并浏览我的文本(Gaddis C++ 介绍，第 6 章)并尝试了一些事情——主要是移动循环，因为我认为我放错了；我也搜索了几个

行者123

个人简介

我是一名优秀的程序员,十分优秀！

作者热门文章

滴滴打车优惠券免费领取

全站热门文章

首页

博学

6Ren·AI

商城

javascript - 石头、布、剪刀、蜥蜴、史波克

Plunkr Demo