Javascript事件循環只有一次，沒有輸出

我正在寫一個JS代碼來計算最終成績，給出一些個人成績，並在html頁面輸出結果，但當我觸發事件和功能時，它只在我的循環中循環一次循環而不會到達代碼的其餘部分（我使用打印語句進行檢查），但我不明白循環的問題導致其餘代碼無法到達。Javascript事件循環只有一次，沒有輸出

HTML：

<!DOCTYPE html> 
<html> 
    <head> 
     <title>Problem 2</title> 
     <script src="grades.js" type="text/javascript"></script> 
    </head> 

    <body> 
     <h1>Grade Calculator</h1> 
     <form id ="myForm"> 
      <div id="assignments"> 
      HW <input type="text" size="1"/>/<input type="text" size="1"/><br/> 
      HW <input type="text" size="1"/>/<input type="text" size="1"/><br/> 
      HW <input type="text" size="1"/>/<input type="text" size="1"/> 
      </div> 

      <div> 
       <input type="checkbox" id="curve"/> Curve +5? 
      </div> 

      <div id="resultsarea"> 
       <p> 
        <!--add buttons here --> 
        <button type="button" id="comp">Compute</button> 
        <button type="button" id="clr">Clear</button> 
       </p> 

       <!-- add results here --> 
      </div> 
     </form> 
    </body> 
</html>

JS：

window.onload = pageLoad; 

function pageLoad() 
{ 
    var cbutton = document.getElementById("comp"); 
    cbutton.onclick = compute; 
} 

function compute() 
{ 
    var list = document.getElementsByTagName("input"); 
    var marks = 0; 
    var total = 0; 
    for (var i=1; i <= list.length; i++) 
    { 
     if(list[i].type == "text") 
     { 
      if (i%2 != 0) 
      marks += list[i].value; 
      else 
      total += list[i].value; 
     } 
    } 
    var result = Math.round(marks/total); 
    if (document.getElementById("curve").checked) 
    result += 5; 
    var out = document.createElement("div"); 
    var t = document.createTextNode(result); 
    out.appendChild(t); 
    var display = document.getElementById("resultsarea"); 
    display.append(out); 
}

來源

2013-03-30 AuthenticReplica

爲什麼你從'i = 1'迭代到'i = list.length'而不是'i = 0'到'i = list.length-1'？ – Rikonator

我認爲這是一個索引問題，所以我試圖切換它，但沒有沒有理由，它應該從0 – AuthenticReplica

開始你有機會測試這個，tarek？ – smerny

陣列值從0.try I = 0和I < = list.length-1.you未計數第一個列表元素開始。

你是從列表[1] .type不是列表[0] .type開始的。

來源

2013-03-30 14:58:07 Amrendra

你的代碼有兩個問題。

第一：

for (var i=1; i <= list.length; i++)

應該是：

for (var i=1; i <= list.length - 1; i++)

因爲數組是從0

啓動，但是，我認爲這是應該由0改爲1來啓動像這樣：

for (var i=0; i < list.length; i++)

二：

display.append(out);

應該是：

display.appendChild(out);

沒有append方法，使用appendChild代替。

來源

2013-03-30 14:58:54

我知道索引已關閉我只是在嘗試並忘記恢復值，但我修復了這個問題，但appendChild仍然沒有輸出：/ – AuthenticReplica

你的意思是沒有輸出是什麼意思？ –

這些循環都不正確。 – Bergi

NodeLists（以及JavaScript中的數組）是零索引的，它們的最後一個元素是length-1。因此，循環需要爲

for (var i=0; i<list.length; i++) 
// or 
for (var i=0; i<=list.length-1; i++) // uncommon

只能訪問列表中存在的項目。否則，它們將導致undefined，並且訪問其value屬性會拋出一個異常，該異常會停止您的整個功能 - 因此沒有任何輸出。您應該能夠在您的[error] console中看到異常。

來源

2013-03-30 15:09:20 Bergi

通過我的答案看起來似乎沒有人有這個的主要問題......所以：

... 
for (var i=0; i <= list.length-1; i++) 
{ 
    if(list[i].type == "text") 
    { 
     if (i%2 == 0) 
     marks += parseInt(list[i].value); 
     else 
     total += parseInt(list[i].value); 
    } 
} 
var result = Math.round(parseFloat(marks/total)*100); 
...

你沒有解析值整數，這意味着它們連接起來，而不是增加。 ...然後你在進行整數除法的事情本來會是0-1（舍入後總是爲0或1），所以我先乘以100 ...也是你的i％2！= 0正在賦予錯誤的變種，所以我改變了..這裏是一個jsfiddle展示它的作品..http://jsfiddle.net/6Y8xY/1/

來源

2013-03-30 15:17:45 smerny

Javascript事件循環只有一次，沒有輸出

回答

相關問題