0
私は自分のJSプロジェクトを始めました。 最後に、私は自分のスロットマシンを持っていたいと思います。 今、プログラムを再起動する方法や、新しいランダム値を何度も何度も生成する関数がわからないという問題があります。 これは今まで私のコードです：JavaScript乱数生成器をリセットするには
var randomX1 = Math.ceil(Math.random() * 10);
var randomX2 = Math.ceil(Math.random() * 10);
var randomX3 = Math.ceil(Math.random() * 10);
function randomClickX() {
document.getElementById("randomX1").innerHTML = randomX1;
document.getElementById("randomX2").innerHTML = randomX2;
document.getElementById("randomX3").innerHTML = randomX3;
var ausgabe = "Play again";
if (randomX1 === randomX2) {
if(randomX2 === randomX3) {
var ausgabe = "Jackpot";
}
}
var chance = ausgabe;
function clickChance() {
document.getElementById("chance").innerHTML = chance;
}
document.getElementById('spanId').innerHTML = chance;
};.slot-container {
border: 5px solid red;
vertical-align: middle;
font-size: 50px;
font-family: Leelawadee UI Semilight, Calibri, Arial;
width: 90%;
margin: auto;
height: 0;
padding-bottom: 30%;
}
.slot {
border: 3px solid green;
height: 0;
padding-bottom: 30%;
width: 32%;
margin-right: 1%;
margin-top: 1%;
margin-bottom: 1%;
float: left;
box-sizing: border-box;
}
#slot1 {
margin-left: 1%;
}
h1 {
color: #FC3FD3;
text-align: center;
font-family: Century Gothic;
font-size: 5em;
height: 50px;
}
p {
text-align: center;
vertical-align: middle;
justify-content: center;
}
button {
position: relative;
font-size:20px;
display: block;
background-color: white;
color: black;
border: 2px solid green;
width: 90%;
position: middle;
margin-left: auto;
margin-right: auto;
margin-top: 10px;
margin-bottom: 10px;
}
button:hover {
background-color: green;
}
button.spin-button {
color: blue;
position: absolute;
height: 20%;
}
.answer {
font-family: Century Gothic;
font-size: 20px;
color: red;
text-align: center;
margin-top: 10px;
}
ul.menubar {
list-style-type: none;
margin: 0;
padding: 0;
overflow: hidden;
background-color: #008000;
}
ul.menubar li {
float: left;
}
ul.menubar li a {
color: black;
display: inline-block;
text-align: center;
padding:15px 20px;
text-decoration: none;
transition: 0.3s;
font-family: Century Gothic;
}
ul.menubar li a:hover {
background-color: #00A300;
}<!DOCTYPE HTML>
<html>
<head>
<title>Slotmachine</title>
<script type="text/javascript" src="#.js"></script>
<link type="text/css" rel="stylesheet" href="#.css" />
</head>
<body>
<ul class="menubar" id=topmenubar>
<li><a href="#linkHome">Home</a></li> <!-- bedeutet '#' gleicher Link + Ergänzung?-->
<li><a href="#linkContact">Contact</a></a></li>
<li><a href="#linkAbout">About</a></li>
</ul>
<h1>1-10</h1>
<button type="button" id="spin-button" class="button" onClick="randomClickX()">SPIN</button>
<div class="slot-container">
<div id="slot1" class="slot">
<p> <!-- Your random number: --> <a id="randomX1">0</a></p>
</div>
<div id="slot2" class="slot">
<p> <!-- Your random number: --> <a id="randomX2">0</a></p>
</div>
<div id="slot3" class="slot">
<p> <!-- Your random number: --> <a id="randomX3">0</a></p>
</div>
</div>
</div>
<div class="answer" id="spanId">Test #1<a id="spanId"> </div>
</body>
</html>見ての通り、私はした新しいrandomsを持っているために、再度SPIN-ボタンをクリックしてHTMLファイルをリロードします。 私は、大きな総合的な機能を作り、SPIN機能が終了したときにそれを呼び出すことが重要だと思います。しかし、私は今それを行う方法はありません... ユーザーが望むだけ多くの値を持つための欠けているステップは何ですか？
おかげで、ジョナス
ただ、それはあなたが、この場合には、「再起動」によって何を意味するのか私には本当にはっきりしていない、あなたの 'randomClickX'機能（カットアンドペースト） – Hackerman
の内側にあなたの変数を含みます。一般に、複数回の操作を実行する場合は、その操作をループ内に入れます。それはあなたがここで欲しいものですか？ – David
あなたは 'location.reload（）;'を使うことができました – Tinsten