如何在已经更改后比较两个不同的值?

时间:2017-08-16 00:35:23

标签: javascript

我正在创建一个石头剪刀游戏,我正在使用按钮,用户可以选择选择石头纸或剪刀,但我不知道如何比较用户答案的​​结果和计算机的答案找出谁赢了。

number = Math.floor(Math.random()*6)+1;

function results(){
    switch(number){
        case 6: case 5: var a = document.getElementById("computer").innerHTML="Rock";
        break;
        case 4: case 3: var b = document.getElementById("computer").innerHTML="Paper";
        break;
        case 2: case 1: var c = document.getElementById("computer").innerHTML="Scissors";
        break;
    }
}

function paper(){
    switch(true){
        case (number <= 6): var paper = document.getElementById("user").innerHTML="Paper";
        break;
    }
}

function rock(){
    switch(true){
        case (number <= 6): var rock = document.getElementById("user").innerHTML="Rock";
        break;
    }
}

function scissors(){
    switch(true){
        case (number <= 6): var rock = document.getElementById("user").innerHTML="Scissors";
        break;
    }
}

1 个答案:

答案 0 :(得分:0)

您只需要一个功能,当用户点击任何选项时会触发,然后在同一个功能中,您可以选择计算机,然后根据它们找出胜利者。检查以下示例:

HTML:

<div id="c"></div>
<div id="u"></div>   
<div id="r"></div>
 // send parameter to function, 1 for Rock, 2 for Paper and 3 for Scissors
<button onclick="startg(1)">
  Rock
</button>
<button onclick="startg(2)">
  Paper
</button>
<button onclick="startg(3)">
   Scissors
</button>

Java脚本:

function startg(userChoice){

 document.getElementById("u").innerHTML="";
 document.getElementById("c").innerHTML="";
 document.getElementById("r").innerHTML="";

 var comNumber = Math.floor(Math.random()*3)+1;

 switch (userChoice){
    case 1 : {
       document.getElementById("u").innerHTML="You Choosed : Rock";
       break;
      }
    case 2 : {
       document.getElementById("u").innerHTML="You Choosed : Paper";
       break;
      }
    case 3 : {
       document.getElementById("u").innerHTML="You Choosed : Scissors";
       break;
     }
 }

 switch (comNumber){
    case 1 : {
       document.getElementById("c").innerHTML="Compouter Choosed :Rock";
       break;
    }
   case 2 : {
       document.getElementById("c").innerHTML="Compouter Choosed :Paper";
       break;
    }
   case 3 : {
       document.getElementById("c").innerHTML="Compouter Choosed :Scissors";
       break;
    }
 }


    //Results :

    if (userChoice == 1 && comNumber==2)
       document.getElementById("r").innerHTML="Result : Computer Win!";
    else if (userChoice == 2 && comNumber==1)
       document.getElementById("r").innerHTML="Result : You Win!";
    else if (userChoice == 1 && comNumber==3)
       document.getElementById("r").innerHTML="Result : You Win!";
    else if (userChoice == 3 && comNumber==1)
       document.getElementById("r").innerHTML="Result : Computer Win!";
    else if (userChoice == 2 && comNumber==3)
       document.getElementById("r").innerHTML="Result : Computer Win!";
    else if (userChoice == 3 && comNumber==2)
       document.getElementById("r").innerHTML="Result : You Win!";
    else if (userChoice == comNumber)
       document.getElementById("r").innerHTML="Result : Draw";
 }

您可以在此处查看一个有效的示例:https://jsfiddle.net/emilvr/wpkj6rw6/4/