Member 12860021 Ответов: 3

Я с трудом получаю какие-либо выходные данные от компьютера. Неправильное использование переменных? Или проблема с моими if-утверждениями?

Эта программа JavaScript позволит пользователю играть в камень, бумагу, ножницы против компьютера. Если игрок хочет играть в игру, он должен нажать кнопку, чтобы начать игру. Программа предложит игроку ввести выбор “камень “для камня,” бумага “для бумаги,” ножницы "для ножниц," ящерица "для ящерицы и" спок " для Спока. Компьютерный "игрок" сгенерирует случайное число, указывающее на его выбор.

Затем программа покажет, кто выиграл игру (компьютер или игрок), а также выбор, сделанный компьютером и игроком.

 <head>
     <title> RPSSL </title>
  </head>

  <div style="width: 1331px; height: 62px; background-color: #263035"> <!-- Header -->
     <center><h1>Rock, Paper, Scissors, Lizard, and Spock</h1></center></div> 

 <center>
    

<form onsubmit="Game()"> <!-- Textbox and submit button -->
<input type="text" id=user onsubmit="UserChoice" placeholder="Make your choice...">
<input type="submit" value="Submit">
</form></center>


var rock = 1;

 var paper = 2;

 var scissors = 3;

 var spock = 4;

 var lizard = 5;

 function Game() {

 var ComputerChoice = ((Math.Random() * 5) + 1); // from 1 - 5 it chooses one of the given variables to then compare to the users anwser

 var UserChoice = document.getElementById("user").value; // input from the textbox

 if (UserChoice == ComputerChoice) { // if both anwsers are the same then a tie is given

    document.getElementById("user").innerHTML = "<h2>Its a tie! Your opponent also chose </h2>" + ComputerChoice;

 }

 if (ComputerChoice == 1) { // Makes the computers choice readable for the user
    return "Rock";
 }

 if (ComputerChoice == 2) {
    return "Paper";
 }
 if (ComputerChoice == 3) {
    return "Scissors";
 }
 if (ComputerChoice == 4) {
    return "Spock";
 }
 if (ComputerChoice == 5) {
    return "Lizard";
 }

 if (ComputerChoice == 1 && UserChoice == 2) { // how the computer decides winner

    document.getElementById("user").innerHTML = "<h1>You won! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 1 && UserChoice == 3) {

    document.getElementById("user").innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 1 && UserChoice == 4) {

    document.getElementById("user").innerHTML = "<h1>You won! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 1 && UserChoice == 3) {

    document.getElementById("user").innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 2 && UserChoice == 1) {

    document.getElementById("user").innerHTML = "<h1>You won! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 2 && UserChoice == 3) {

    document.getElementById("user").innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 2 && UserChoice == 4) {

    document.getElementById("user").innerHTML = "<h1>You won! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 2 && UserChoice == 3) {

    document.getElementById("user").innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 3 && UserChoice == 1) {

    document.getElementById("user").innerHTML = "<h1>You won! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 3 && UserChoice == 2) {

    document.getElementById("user").innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 3 && UserChoice == 4) {

    document.getElementById("user").innerHTML = "<h1>You won! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 3 && UserChoice == 3) {
    document.getElementById("user").innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 4 && UserChoice == 1) {

    document.getElementById("user").innerHTML = "<h1>You won! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 4 && UserChoice == 2) {

    document.getElementById("user").innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 4 && UserChoice == 5) {

    document.getElementById("user").innerHTML = "<h1>You won! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 4 && UserChoice == 3) {

    document.getElementById("user").innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 5 && UserChoice == 1) {

    document.getElementById("user").innerHTML = "<h1>You won! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 5 && UserChoice == 2) {

    document.getElementById("user").innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 5 && UserChoice == 4) {

    document.getElementById("user").innerHTML = "<h1>You won! The computer chose</h1>" + ComputerChoice;

 }

 if (ComputerChoice == 5 && UserChoice == 3) {

    document.getElementById("user").innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;

 }

 }


Что я уже пробовал:

Проблема, с которой я сталкиваюсь, заключается в том, что когда var "UserChoice" помещает свой ответ в текстовое поле и они нажимают "отправить", экран становится пустым. Я также не знаю, как аккуратно записать свои утверждения "если", не имея большого списка. Я очень новичок в JavaScript, поэтому мои навыки и способности находятся на низком уровне. Спасибо вам за помощь!

3 Ответов

Рейтинг:
2

Patrice T 

    if (ComputerChoice == 1) {
    return "Rock";
}
if (ComputerChoice == 2) {
    return "Paper";
}
if (ComputerChoice == 3) {
    return "Scissors";
}
if (ComputerChoice == 4) {
    return "Spock";
}
if (ComputerChoice == 5) {
    return "Lizard";
}
    // Your code will never go beyond this point because of the returns


Вы должны научиться использовать отладчик как можно скорее. Вместо того чтобы гадать, что делает ваш код, пришло время увидеть, как он выполняется, и убедиться, что он делает то, что вы ожидаете.

Отладчик позволяет вам следить за выполнением строка за строкой, проверять переменные, и вы увидите, что есть точка, в которой он перестает делать то, что вы ожидаете.
Отладчик-Википедия, свободная энциклопедия[^]
Отладка JavaScript[^]

Отладчик здесь для того, чтобы показать вам, что делает ваш код, и ваша задача-сравнить его с тем, что он должен делать.
В отладчике нет никакой магии, он не находит ошибок, он просто помогает вам. Когда код не делает того, что ожидается, вы близки к ошибке.

Рейтинг:
1

Tadit Dash (ତଡିତ୍ କୁମାର ଦାଶ)

Вы можете использовать чехол переключателя вместо АО многих "если".

Когда пользователь отправит сообщение, покажите загрузочное изображение, а когда вы будете готовы показать результат, непосредственно перед этим скройте это загрузочное изображение.

Рейтинг:
1

Peter Leow

Есть много вопросов:
1. это должно быть 

Math.random()

нет
Math.Random()

Метод JavaScript random() [^]
и он возвращает плавающее число, а не целое число, которое вы хотели, вы должны уложить его с помощью метода Math.floor ().
2. поведение по умолчанию при отправке формы заключается в отправке данных формы на сервер и обновлении самой страницы, что объясняет, почему после нажатия кнопки отправки вы получили пустую страницу. Чтобы отменить это поведение по умолчанию, вы должны вернуть false из вашей функции JavaScript, например
<form onsubmit="return Game()">

function Game() {
  // all preceding code
  return false;
}

3. Кому, по вашему мнению, эти коды "вернут" свою ценность?
if (ComputerChoice == 1) { // Makes the computers choice readable for the user
   return "Rock";
}

if (ComputerChoice == 2) {
   return "Paper";
}
if (ComputerChoice == 3) {
   return "Scissors";
}
if (ComputerChoice == 4) {
   return "Spock";
}
if (ComputerChoice == 5) {
   return "Lizard";
}

Вы должны поместить их внутрь функции и вызвать ее изнутри игры().
4. Почему здесь есть этот onsubmit="UserChoice"? Не забудьте заключить значение идентификатора в кавычки.
<input type="text" id=user onsubmit="UserChoice" placeholder="Make your choice...">

5. Используйте, если...еще, если... строим так, чтобы избежать того, чтобы проверить все ли в JavaScript Если...Другие Заявления[^]
6. наконец, вы пытаетесь отобразить результат внутри текстового поля ввода с тегом h1, но это не сработает.
Вы должны отобразить результат в другом div размещения, например
<div id="result"></div>

Затем отобразите результат в этом div через JavaScript, например
document.getElementById('result').innerHTML = "<h1>You lost! The computer chose</h1>" + ComputerChoice;