2011-02-17 40 views
1

我應該做這個簡單的程序。它產生了一個乘法問題,當用戶鍵入正確答案時,它應該產生另一個問題。相反,它會進入一個無限循環,永不停止,答案字段和按鈕消失。此外,我應該做出關於用戶回答的評論,這是四種不同的說法之一。沒有使用陣列,我會怎麼做?JavaScript Multiplication Game

我的教授沒有幫助,真的越來越嚴重,因爲我沒有其他地方可以轉身。

<html> 
    <title>HW 9.27 and 9.28</title> 
    <head> 
     <script type="text/javascript"> 
      var number1; 
      var number2; 
      var answer3; 
      var answer2; 

      function problem() { 
       number1 = Math.floor(1 + Math.random() * 9); 
       number2 = Math.floor(1 + Math.random() * 9); 
       document.writeln("How much is " + number1 + " times " + number2 + " ?"); 
       answer2 = (number1 * number2); 
      } 

      function answer1() { 
       var statusDiv = document.getElementById("status"); 
       answer3 = document.getElementById("answer").value; 

       if (answer3 != answer2) statusDiv.innerHTML = "No. Please try again"; 
       else if (answer3 == answer2) { 
        statusDiv.innerHTML = "Very good!"; 
        problem(); 
       } 
      } 
      problem(); 

     </script> 
    </head> 
    <body> 
     <form> 
      <input id="answer" type="text" /> 
      <input type="button" value="Solve!" onclick="answer1()" /> 
      <div id ="status">Click the Solve button to Solve the problem</div> 
     </form> 
    </body> 
</html> 
+0

哎呀,忘了,包括源代碼... – Craig 2011-02-17 23:09:18

+0

我想最後`問題()`可能正在創建循環。另外,請澄清標題中的問題。 「Javacript問題」是非常沒有意義的。 – Johannes 2011-02-17 23:19:39

回答

2

簡單地說,document.writeln("How much is " + number1 + " times " + number2 + " ?");擦除所有內容然後寫入字符串。所以你放棄了所有的表單輸入。

它不會在初始頁面加載時發生的原因是因爲調用document.writeln發生在表單元素加載之前。

試試這個:

<html> 
<title>HW 9.27 and 9.28</title> 
<head> 
<script type="text/javascript"> 
var number1; 
var number2; 
var answer3; 
var answer2; 

function problem() 
{ 
number1 = Math.floor(1 + Math.random() * 9); 
number2 = Math.floor(1 + Math.random() * 9); 
document.getElementById("prompt").innerHTML = "How much is " + number1 + " times " +  number2 + " ?"; 
answer2 = (number1*number2); 
} 

function answer1() 
{ 
var statusDiv = document.getElementById("status"); 
answer3=document.getElementById("answer").value; 

if(answer3 != answer2) 
statusDiv.innerHTML="No. Please try again"; 
else 
if (answer3==answer2) 
{ 
statusDiv.innerHTML="Very good!"; 
problem(); 
}} 


</script> 
</head> 
<body onload="problem();"> 
<form> 
<div id ="prompt"></div> 
<input id="answer" type="text" /> 
<input type="button" value="Solve!" onclick="answer1()" /> 
<div id ="status">Click the Solve button to Solve the problem</div> 
</form> 
</body> 
</html> 
1

沒有無限循環,但document.writeln會引起問題。

我建議你設置問題的方式與設置其他消息的方式相同。

1

我認爲問題是與document.writeln。 你有問題的div代替,然後把這個問題作爲innerHTMl分配給那個div。

試試這個:

<html> 
<title>HW 9.27 and 9.28</title> 
<head> 
<script type="text/javascript"> 
var number1; 
var number2; 
var answer3; 
var answer2; 

function problem() 
{ 
    number1 = Math.floor(1 + Math.random() * 9); 
    number2 = Math.floor(1 + Math.random() * 9); 
    var question = document.getElementById("question"); 
    question.innerHTML = "How much is " + number1 + " times " + number2 + " ?"; 
    answer2 = (number1*number2); 
} 

function answer1() 
{ 
    var statusDiv = document.getElementById("status"); 
    answer3=document.getElementById("answer").value; 

    if(answer3 != answer2) 
    statusDiv.innerHTML="No. Please try again"; 
    else 
    if (answer3==answer2) 
    { 
     statusDiv.innerHTML="Very good!"; 
     document.getElementById("answer").value = ""; 
     problem(); 
    } 
} 
</script> 
</head> 
<body> 
<form> 
    <div id ="question"></div> 
    <input id="answer" type="text" /> 
    <input type="button" value="Solve!" onclick="answer1()" /> 
    <div id ="status">Click the Solve button to Solve the problem</div> 
</form> 
<script type="text/javascript"> 
    problem(); 
</script> 
</body> 
</html> 
0

你有幾個問題:

首先,當你點擊求解按鈕你answer1功能是沒有得到調用。 我建議不要使用HTML onclick,但補充說:

document.getElementById("solve").onclick = answer1; 

到您的JavaScript。

此外,你正在比較字符串輸入到一個數字。這是行不通的。您需要將輸入轉換爲數字。使用parseInt(answer3,10) 10表示基數爲10,並確保06被解釋爲6而不是八進制。我不會使用if,然後else if。只需使用if然後else這樣:

if (parseInt(answer3,10) === answer2){ 
     //got it right! 
    } 
    else { 
     ///got it wrong 
    } 

也不要使用document.writeln。它正在刪除您網頁上的內容。創建div<div id="problem"></div>與填充:

problemDiv.innerHTML = "How much is " + number1 + " times " + number2 + " ?"; 

還應該重命名你的變量。您的變量名稱不明確。

祝你好運!

東西閱讀:

Try it out!