Как сменить картинку с помощью скалы, бумаги, ножниц?

Я пытаюсь создать игру Rock Paper Scissors в JavaScript, но также иметь ее, где компьютер выводит изображения в документ HTML. Я пробовал все, что знаю, и это не сработает. Вот HTML:Как сменить картинку с помощью скалы, бумаги, ножниц?

<!DOCTYPE html> 
    <html> 
    <head> 
     <script src="Rock Paper Scissors.js"></script> 
    </head> 
    <body> 
     <p>Your choice:<img id="myImage" onafterprint="userImgDisplay()" src="blank.png" width="250px" height="250px"/>The computer's choice:<img id="myImage" onload="comImgDisplay()" src="blank.png" width="250px" height="250px"/> 
     </p>`

И вот JavaScript:

var userChoice = prompt("Do you choose rock, paper or scissors?","Don't use articles (i.e. the, a, etc.)").toLowerCase(); 

var computerChoice = Math.random(); 

if (computerChoice < 0.34) { 
    computerChoice = "rock"; 
} else if(computerChoice <= 0.67) { 
    computerChoice = "paper"; 
} else { 
    computerChoice = "scissors"; 
} 

function userImgDisplay() { 
    var image = document.getElementById('myImage'); 
    if (userChoice = "rock") { 
    image.src = "rock.png"; 
    }else if (userChoice = "paper") { 
    image.src = "paper.png"; 
    }else if (userChoice = "scissors") { 
    image.src = "scissors.png"; 
    } 
} 

function comImgDisplay() { 
    var image = document.getElementById('myImage'); 
    if (computerChoice = "rock") { 
    image.src = "rock.png"; 
    }else if (computerChoice = "paper") { 
    image.src = "paper.png"; 
    }else if (computerChoice = "scissors") { 
    image.src = "scissors.png"; 
    } 
}

"rock.png", "paper.png", и "scissors.png" основаны на соответствующих элементов, и «blank.png» - это просто прозрачное изображение. Эта программа всегда будет отображать «rock.png» для моего выбора и ничего для компьютера. Что я делаю не так?

источник

2015-05-11 Tony Summerville

Какой браузер? 'onafterprint' не поддерживается в Chrome, Safari или Opera –

также, вам нужно изменить это (' '' if (userChoice = "rock") '' 'to' '' if (userChoice == "rock") '' 'и сделайте это для каждого из них. Вот как работают сравнения в javascript. В настоящее время вы назначаете значение одним знаком' '' = '' ' –

^^^ похоже, что вы назначаете камень UserChoice ... каждый (вместо сравнения UserChoise с камнем) –

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

Например посмотрите на мои изменения в этом методе, у вас есть проблемы, как это во всех своих методах.

function comImgDisplay() { 
    var image = document.getElementById('myImage'); 
if (computerChoice == "rock") { 
    image.src = "rock.png"; 
}else if (computerChoice == "paper") { 
    image.src = "paper.png"; 
}else if (computerChoice =="scissors") { 
    image.src = "scissors.png"; 
} 
}

Для простоты можно просто сделать это:

function comImgDisplay() { 
    var image = document.getElementById('myImage'); 
    image.src = computerChoice + ".png"; 
}

источник

2015-05-11 23:56:49

-1

Если вы делаете игру, я рекомендую использовать JQuery.

Но если вы хотите сделать это вот так, то вот код. Я также исправил некоторые синтаксические ошибки.

var userChoice = prompt("Do you choose rock, paper or scissors?", 
    "Don't use articles (i.e. the, a, etc.)").toLowerCase(); 
var computerChoice = Math.random(); 
if (computerChoice < 0.34) computerChoice = "rock"; 
else if (computerChoice <= 0.67) computerChoice = "paper"; 
else computerChoice = "scissors"; 
['userImgDisplay', 'comImgDisplay'].forEach(function(element) { 
    window[element] = function() { 
     var image = document.getElementById('myImage'); 
     if (userChoice == "rock") image.setAttribute("src", "rock.png"); 
     else if (userChoice == "paper") image.setAttribute("src", "paper.png"); 
     else if (userChoice == "scissors") image.setAttribute("src", "scissors.png"); 
    } 

});

источник

2015-05-12 00:04:44

Ваш рефакторинг двух функций отображения изображений не учитывает, что одна из функций проверяет 'userChoice', а другой проверяет' computerChoice'. – Interrobang

Как сменить картинку с помощью скалы, бумаги, ножниц?

ответ

Смежные вопросы