簡單的HTML和JavaScript的shell遊戲

我一直在這個工作了幾天，我已經到了試圖找出爲什麼這不顯示輸贏的信息。這是一個簡單的shell遊戲，只使用HTML，JavaScript和一個小的CSS文件。認爲這是JavaScript我有問題，我已經拿出了這麼多的線，現在我有點失落。任何推向正確的方向將是巨大的。簡單的HTML和JavaScript的shell遊戲

var noOfShells; 
 
var noOfShells = 3; 
 
var looplimit = noOfShells + 1; 
 

 
function ballShell(shells) { 
 

 
    var ballLoc = (Math.floor(Math.random() * shells)) + 1; 
 
    return ballLoc; 
 
} 
 
document.getElementById('elTwo').innerHTML = ballShell(); 
 

 
var ballIs = ballShell(noOfShells); 
 

 
function newShell(newID, ballIs) { 
 
    this.shellId = newID; 
 
    this.shellName = "Shell" + newID; 
 
    this.ballIn = ballIs; 
 
    this.hasBall = function() { 
 
    var theId = newID; 
 
    var theBall = ballIs; 
 
    var checkMsg = "My number is " + theId + ". The ball is in shell " + theBall; 
 

 
    if (theId === theball) { 
 
     var checkMsg = checkMsg + " You Win! "; 
 
     return checkMsg; 
 
    } else { 
 
     var checkMsg = checkMsg + " You Lose! "; 
 
    } 
 
    }; 
 
} 
 
for (var i = 1; i < 4; i++) { 
 
    this["shell" + i] = new newShell(i, ballIs); 
 
} 
 
var shellOneLink = document.getElementById('shellOne'); 
 
shellOneLink.addEventListener('click', shell1.hasball(), false); 
 

 
function reloadPage() { 
 
    location.reload(); 
 
} 
 
var activateReload = document.getElementById('reloadLink'); 
 
activateReload.onclick = reloadPage;

ul { 
 
    width: 100%; 
 
    text-align: center 
 
} 
 
ul li { 
 
    display: inline-block; 
 
    width: 200px; 
 
    border: solid 1px #ccc; 
 
}

<link rel="stylesheet" type="text/css" href="css/base.css"> 
 
<header> 
 
    <h1>Shell Game</h1> 
 
    <nav> 
 
    <ul> 
 
     <li> 
 
     <a id="shellOne" href="#"> 
 
      <img src="images/shell.jpg" alt="shell"> 
 
     </a> 
 
     </li> 
 

 
     <li> 
 
     <a id="shellTwo" href="#"> 
 
      <img src="images/shell.jpg" alt="shell"> 
 
     </a> 
 
     </li> 
 

 
     <li> 
 
     <a id="shellThree" href="#"> 
 
      <img src="images/shell.jpg" alt="shell"> 
 
     </a> 
 
     </li> 
 
    </ul> 
 
    </nav> 
 
</header> 
 
<main> 
 
    <h3 id="text-message">&nbsp;</h3> 
 
</main> 
 
<footer> 
 
    <a id="reloadLink" href="index.html">Reload Page</a> 
 
</footer>

來源

2016-05-05 Dewie

'this''爲內（VAR I = 1; I <4;我++） {「shell」+ i] = new newShell（i，ballIs）; }'指的是全局對象。在分配給Object之前，你需要調用一個'new'實例。 – PHPglue

我可以爲你編輯問題嗎？但我相信你可以自己刪除它 –

我試過了，但它說因爲它有一個答案附加到ti – Dewie

你只包括你的樣式表，而不是你的JavaScript源文件。你必須包括這樣的：

<script src="myscripts.js"></script>

來源

2016-05-05 02:24:34 ebimanuel

我做了它只是從粘貼中斷 – Dewie

下面是一個簡單殼遊戲的例子：

var doc = document, bod = doc.body; 
function E(id){ 
    return doc.getElementById(id); 
} 
function ShellGame(displayElement){ 
    this.play = function(shellNum){ 
    var shell = Math.floor(Math.random()*3), r = 'You Lost!'; 
    switch(shellNum){ 
     case 0: 
     if(shell === 0){ 
      r = 'You Won!'; 
     } 
     break; 
     case 1: 
     if(shell === 1){ 
      r = 'You Won!'; 
     } 
     break; 
     case 2: 
     if(shell === 2){ 
      r = 'You Won!'; 
     } 
     break; 
    } 
    displayElement.innerHTML = r; 
    } 
} 
var sg = new ShellGame(E('text-message')); 
E('shellOne').onclick = function(){ 
    sg.play(0); 
} 
E('shellTwo').onclick = function(){ 
    sg.play(1); 
} 
E('shellThree').onclick = function(){ 
    sg.play(2); 
}

來源

2016-05-05 02:56:22 PHPglue

簡單的HTML和JavaScript的shell遊戲

回答

相關問題