無法切換圖像

我只是在學習一些java。我目前正在學習if，else語句。無法切換圖像

在我創建的遊戲中，用戶從0到10之間挑選一個數字並將其放入輸入框中。如果正確，屏幕上的圖像將更改爲一張圖片，如果不正確，則會切換到另一張圖片。但是，我似乎無法讓圖像改變。我嘗試了幾種不同的編碼方式;我目前正在使用一個img數組。但是，當我執行代碼時，我收到ObjectHTMLImageElement錯誤。

這裏是我當前的代碼：

<div id="top"> 
    <h1>Pie in the Face</h1> 
    <p>Guess how many fingers I'm holding up between 0 and 10. 
     <br /> If you guess correctly, I get a pie in the face. 
     <br /> If you guess wrong, you get a pie in the face.</p> 

    <input id="answer" /> 
    <button id="myButton">Submit</button> 
    </center> 
</div> 
<div id="container"> 
    <div id="image"></div> 
    <div id="manpie"></div> 
    <div id="girlpie"></div> 
</div> 


<script type="text/javascript"> 
    var x = Math.random(); 

    x = 11 * x; 
    x = Math.floor(x); 

    var imgArray = new Array(); 

    imgArray[0] = new Image(); 
    imgArray[0].src = "images/manpie2.jpg"; 

    imgArray[1] = new Image(); 
    imgArray[1].src = "images/girlpie2.jpg"; 


    document.getElementById("myButton").onclick = function() { 

     if (x == document.getElementById("answer").value) { 
      document.getElementById("image").innerHTML = imgArray[0]; 

      // what I had document.getElementById("image").innerHTML=imgArray[0]; 

     } else { 
      document.getElementById("image").innerHTML = imgArray[1]; 
     } 

    } 
</script> 

</body>

我已經用線等也嘗試：document.getElementById("image").innerHTML=document.getElementById("manpie");

，然後沒有什麼作品。這是一個鏈接到它的「活」網站。 http://176.32.230.6/mejorarcr.com/

任何幫助，將不勝感激。謝謝！

來源

2015-05-14 Jarred De Salvo

首先有一個很大的區別[標籤：JAVA]和[標籤：java描述。事實上，Java是一件事情，JavaScript是另一回事，但都是編程語言。 – SaidbakR

嗯，好吧，我想我需要了解這種差異！ –

你必須改變在innerHTML值的代碼：

if (x==document.getElementById("answer").value) { 
      document.getElementById("image").innerHTML='<img src="'+imgArray[0].src+'" />'; 

      // what I had document.getElementById("image").innerHTML=imgArray[0].src; 

     } else { 
     document.getElementById("image").innerHTML='<img src="'+imgArray[1].src+'" />'; 
     }

DEMO或this

來源

2015-05-14 23:26:29 SaidbakR

好的演示...我可以整晚演奏。：D – Roberto

歡迎您！ :) – SaidbakR

這工作！非常感謝你！我完全確定，爲什麼我必須在那裏更改圖像源，如果我引用了數組，但也許它只是那些在數學中就像是一樣的東西，有些東西就是這樣。再次感謝您！ –

變化：

document.getElementById("image").innerHTML=imgArray[0];

到：

document.getElementById("image").setAttribute("src", imgArray[0]);

確保imgArray [0]是實際的圖片路徑：

  imgArray[0]="images/manpie2.jpg"; 

      imgArray[1]="images/girlpie2.jpg";

來源

2015-05-14 23:13:02

謝謝！這是有道理的，這一切仍然讓我有些困惑，但是這有助於我必須鎖定的一些思維模式。 –

無法切換圖像

回答

相關問題