2
JSFiddleのバージョンは、私が代わりに Working Codepenは、jQueryのまたはJavaScript
をcodepen追加しましたので、働いていなかったとボタンを使用して変数を更新するにはどうすればそう、私は謝罪するJavaScriptとjQueryにかなり新しいです私の言葉が正しくない場合、または答えが非常に明白な場合、私はここに学びます:)私はロックペーパーのハサミゲームを構築しました。私は変数 'computerChoice'を更新する方法を理解できません。私はページをリフレッシュするように設定することができましたが、それは私が達成したいことではありません。私はあなたが '新しいゲーム'をクリックすると、変数 'computerChoice'は、ページを更新するときのように、乱数に応じて新しいオプションを選択するようにします。私はあなたが '新しいゲーム'をクリックするとnullに設定しようとしましたが、ゲームをプレイするときに数字を返します。
HTML：
<h1>Rock Paper Scissors</h1>
<h2>Pick your weapon!</h2>
<p><button id="refresh">New Game</button></p>
<button onClick='choose("rock")' class="choices">Rock</button>
<button onClick='choose("paper")' class="choices">Paper</button>
<button onClick='choose("scissors")' class="choices">Scissors</button>
<p><button onClick='compare(user, computerChoice)' class="compares">1...2...3...</button></p>
<p><b id="you">...</b> Vs.
<b id="computer">...</b></p>
<p><b id="results"></b></p>
はJavaScript：
//user choices
var user;
var choose = function(choice) {
user = choice;
//document.getElementById("you").innerHTML = user;
}
//computer choices
var computerChoice = Math.random();
if (computerChoice < 0.34) {
computerChoice = "rock";
}
else if (computerChoice < 0.67) {
computerChoice = "paper";
}
else {
computerChoice = "scissors";
}
//compare user choice to computer choice
function compare(choice1, choice2) {
if (choice1 === choice2) {
document.getElementById('results').innerHTML = "How boring, you tied.";
}
else if (choice1 === "rock") {
if (choice2 === "scissors") {
document.getElementById('results').innerHTML = "They'll feel that in the morning.";
} else {
document.getElementById('results').innerHTML = "Can you breathe? I think not.";
}
}
else if (choice1 === "scissors") {
if (choice2 === "paper") {
document.getElementById('results').innerHTML = "Snippitysnip, you sliced them in two.";
} else {
document.getElementById('results').innerHTML = "Ouch, looking a little blunt.";
}
}
else if (choice1 === "paper") {
if (choice2 === "rock") {
document.getElementById('results').innerHTML = "You smothered them, eesh!"
} else {
document.getElementById('results').innerHTML = "You're looking a bit like a banana split."
}
}
else {
document.getElementById('results').innerHTML = "Something's not quite right...what did you do?!"
}
}
// refresh, clear and display computer choices and results. Disable, enable buttons.
function disableButtons() {
$('button.choices').attr('disabled', true);
}
function enableButtons() {
$('button.choices').attr('disabled', false);
}
$('.choices').click(function() {
$('#you').html(user); // this works on codepen but not on jsfiddle? D:
$('#computer').html('...');
disableButtons();
});
$('#refresh').click(function() {
$('#results').html('');
$('#you, #computer').html('...');
enableButtons();
refreshComputer();
});
$('.compares').click(function() {
$('#computer').html(computerChoice);
});
JSFiddleのバージョンは、私が代わりにcodepen Working Codepen
「refreshComputer」はどこに定義されていますか？ –
コンソールを確認してください。その場にはエラーがあり、大部分またはすべてが変数または関数スコープと関係しています。 –
このようなより複雑な質問については、それを[JSFiddle]（https://jsfiddle.net/）または[CodePen]（https://codepen.io/）にスローするのが最善でしょう。そこに役立つ解決策を見つけ出すのがずっと簡単になります。 – samanime