2017-01-05 3 views
1

私はスロットゲームに取り組んでいます。スピナーに数字を聞かせてもらえませんでした。スピンした後、「あなたは1,000,000ポイントを獲得しました!私はこれを行う方法を理解することはできません。誰か助けてくれますか?それは単に乱数スピナー(js)と報酬です。The Slot Game Concern

<button onclick="myFunction()">Spinner 
 
<style> 
 
.button { 
 
    border-radius: 4px; 
 
    background-color: white ; 
 
    border: none; 
 
    color: #FFFFFF; 
 
    text-align: center; 
 
    font-size: 28px; 
 
    padding: 20px; 
 
    width: 200px; 
 
    transition: all 0.5s; 
 
    cursor: pointer; 
 
    margin: 5px; 
 
} 
 
</style> 
 
</button> 
 

 

 

 

 

 
<script> 
 

 
function myFunction() { 
 

 
var y = Math.floor((Math.random() * 15) + 1); 
 
    
 

 
var x = document.createElement("INPUT");   ///Need to break this out of function...Bug 
 
    x.setAttribute("type", "text"); 
 
    x.setAttribute("value", y);//random number will be y 
 
    document.body.appendChild(x); 
 

 
returnRandom(y); 
 
} 
 

 

 
function returnRandom(r){ 
 
//window.alert(r); 
 

 
var result; 
 

 
switch (r) 
 
      { 
 
       case 1: var result = 'A whopping 15,000,000 points! Great job!'; 
 
       break;    
 
       case 2: var result = 'Awh man.. -500,000 points.'; 
 
       break; 
 
       case 3: var result = 'A win! 50,000 points.'; 
 
       break; 
 
       case 4: var result = 'A good win! 1,500,000 points.'; 
 
       break; 
 
       case 5: var result = 'A bad loss.. -355,555 points.'; 
 
       break; 
 
       case 6: var result = 'Nothing! Not bad nor good.'; 
 
       break; 
 
       case 7: var result = ' Lucky seven! 77,777,777 points!'; 
 
       break; 
 
       case 8: var result = '444,444 points.'; 
 
       break; 
 
       case 9: var result = 'Cry me a river! -3,333,333 points'; 
 
       break; 
 
       case 10: var result = 'Oh, You won 5,000,000 points!'; 
 
       break; 
 
       case 11: var result = 'Oh! Wow! 99,999,999 points!'; 
 
       break; 
 
       case 12: var result = 'Meh. -150,000 points.'; 
 
       break; 
 
       case 13: var result = 'You earned it, take 3,000,000 points.'; 
 
       break; 
 
       case 14: var result = 'You lost. -100,000 points.'; 
 
       break; 
 
       case 15: var result = 'You got Fifteen? A big win! 100,000,000 points!'; 
 
       break; 
 

 
      } 
 
    window.alert(result); 
 

 
} 
 

 
</script>

+1

あなたはこれまでのものを表示できますか?外出するものは一切ありません。 – deweyredman

+0

コードがあります。 –

+0

ところで、回答コードにはコメントがありますので、私はそれを動作させるために変更したものを知っています! –

答えて

0

あなたのコードは少し厄介になります。あなたはテキストの本文内のスタイルとテキスト本文のスクリプトのスタイルにCSSを統合しているようです。あなたはCSSのスタイルシートと外部のjavascriptファイルを知っていますか?簡単に作られた。しかし、今のところ次のコードが動作します。スニペットをチェックしてください。

<!doctype html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<title>Slot Machine</title> 
 

 
<style> /*style and script should go in the head section - didn't look like you had them there */ 
 
#spin { /*gave the button an id - you could have other buttons*/ 
 
    border-radius: 4px; 
 
    border: none; 
 
    color: #FFFFFF; /* took out the background color - white on white? how was that going to work? you could put it back in but change the color to #000000; or something*/ 
 
    text-align: center; 
 
    font-size: 28px; 
 
    padding: 20px; 
 
    width: 200px; 
 
    transition: all 0.5s; 
 
    cursor: pointer; 
 
    margin: 5px; 
 
} 
 
#spinresult{width:29px; color:#000000;} 
 
</style> 
 

 
<script> 
 

 
function myFunction() { 
 

 
var y = Math.floor((Math.random() * 15) + 1); 
 
var x = document.getElementById("spinresult");   ///put an input element in the body so it didn't keep creating new ones. 
 
    x.setAttribute("type", "number"); //changed text to number 
 
    x.setAttribute("value", y); //random number is y 
 
    document.body.appendChild(x); 
 

 
returnRandom(y); 
 
}; 
 

 
function returnRandom(r){ 
 
//window.alert(r); 
 

 
var result; 
 

 
switch (r) 
 
      { 
 
       case 1: var result = 'A whopping 15,000,000 points! Great job!'; 
 
       break;    
 
       case 2: var result = 'Awh man.. -500,000 points.'; 
 
       break; 
 
       case 3: var result = 'A win! 50,000 points.'; 
 
       break; 
 
       case 4: var result = 'A good win! 1,500,000 points.'; 
 
       break; 
 
       case 5: var result = 'A bad loss.. -355,555 points.'; 
 
       break; 
 
       case 6: var result = 'Nothing! Not bad nor good.'; 
 
       break; 
 
       case 7: var result = ' Lucky seven! 77,777,777 points!'; 
 
       break; 
 
       case 8: var result = '444,444 points.'; 
 
       break; 
 
       case 9: var result = 'Cry me a river! -3,333,333 points'; 
 
       break; 
 
       case 10: var result = 'Oh, You won 5,000,000 points!'; 
 
       break; 
 
       case 11: var result = 'Oh! Wow! 99,999,999 points!'; 
 
       break; 
 
       case 12: var result = 'Meh. -150,000 points.'; 
 
       break; 
 
       case 13: var result = 'You earned it, take 3,000,000 points.'; 
 
       break; 
 
       case 14: var result = 'You lost. -100,000 points.'; 
 
       break; 
 
       case 15: var result = 'You got Fifteen? A big win! 100,000,000 points!'; 
 
       break; 
 

 
      } 
 
    window.alert(result); 
 

 
}; 
 

 
</script> 
 

 
</head> 
 

 
<body> 
 
<button id="spin" onclick="myFunction()">Spinner</button> 
 
<!--<input type="number" id="spinresult">-->  <!---if you unhide this and hide the other input, you'll see the number--> 
 
<input type="number" hidden="true" id="spinresult"> <!--hid the input so you don't see the number--> 
 

 
</body> 
 
</html>

これは、より良いので、同じように分離することになります。

function calcresult() { 
 

 
var y = Math.floor((Math.random() * 15) + 1); 
 
var x = document.getElementById("spinresult");   ///put an input element in the body so it didn't keep creating new ones. 
 
    x.setAttribute("type", "number"); //changed text to number 
 
    x.setAttribute("value", y); //random number is y 
 
    document.body.appendChild(x); 
 

 
returnRandom(y); 
 
}; 
 

 
function returnRandom(r){ 
 
//window.alert(r); 
 

 
var result; 
 

 
switch (r) 
 
      { 
 
       case 1: var result = 'A whopping 15,000,000 points! Great job!'; 
 
       break;    
 
       case 2: var result = 'Awh man.. -500,000 points.'; 
 
       break; 
 
       case 3: var result = 'A win! 50,000 points.'; 
 
       break; 
 
       case 4: var result = 'A good win! 1,500,000 points.'; 
 
       break; 
 
       case 5: var result = 'A bad loss.. -355,555 points.'; 
 
       break; 
 
       case 6: var result = 'Nothing! Not bad nor good.'; 
 
       break; 
 
       case 7: var result = ' Lucky seven! 77,777,777 points!'; 
 
       break; 
 
       case 8: var result = '444,444 points.'; 
 
       break; 
 
       case 9: var result = 'Cry me a river! -3,333,333 points'; 
 
       break; 
 
       case 10: var result = 'Oh, You won 5,000,000 points!'; 
 
       break; 
 
       case 11: var result = 'Oh! Wow! 99,999,999 points!'; 
 
       break; 
 
       case 12: var result = 'Meh. -150,000 points.'; 
 
       break; 
 
       case 13: var result = 'You earned it, take 3,000,000 points.'; 
 
       break; 
 
       case 14: var result = 'You lost. -100,000 points.'; 
 
       break; 
 
       case 15: var result = 'You got Fifteen? A big win! 100,000,000 points!'; 
 
       break; 
 

 
      } 
 
    window.alert(result); 
 

 
};
#spin { /*gave the button an id - you could have other buttons*/ 
 
    border-radius: 4px; 
 
    border: none; 
 
    color: #FFFFFF; /* took out the background color - white on white? how was that going to work? you could put it back in but change the color to #000000; or something*/ 
 
    text-align: center; 
 
    font-size: 28px; 
 
    padding: 20px; 
 
    width: 200px; 
 
    transition: all 0.5s; 
 
    cursor: pointer; 
 
    margin: 5px; 
 
} 
 
#spinresult{width:29px; color:#000000;}
<!doctype html> 
 
<html> 
 
<head> 
 
<meta charset="utf-8"> 
 
<title>Slot Machine</title> 
 
</head> 
 
<body> 
 

 
<button id="spin" onclick="calcresult()">Spinner</button> 
 
<!--<input type="number" id="spinresult">-->  <!---if you unhide this and hide the other input, you'll see the number--> 
 
<input type="number" hidden="true" id="spinresult"> <!--hid the input so you don't see the number--> 
 

 
</body> 
 
</html>

あなたがしたままの保存>でもnotepad-を使用して(ジャバスクリプトを保存することができます>すべてのファイル(拡張子js)を使用して、<script> </script>タグを使用してリンクしますcssに似ています。 (例:<link rel="stylesheet" type="text/css" href="file.css"/>)Welcome to Stackoverflow!