Javascript表單元素添加到數組，然後總計元素

我需要創建一個接受用戶輸入（整數）的表單，將該輸入添加到數組中，然後對整數進行求和並在網頁上顯示其總數爲文本。我覺得我接近解決方案，但是，當我按下提交按鈕時，沒有任何反應。我對Javascript很陌生，這是一個班級任務。任何人都可以告訴這段代碼看起來是正確的還是建議哪裏可能有錯誤？Javascript表單元素添加到數組，然後總計元素

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
<title>Adding Numbers</title> 
<meta http-equiv="content-type" content="text/html; charset=iso-8859-1" /> 
</head> 
<body> 
<p><script type="javascript"> 
/* <![CDATA[ */ 
function addNums() { 
var total = 0; 
var intergers = new Array(5); 
intergers[0] = document.forms[0].element[0].value; 
intergers[1] = document.forms[0].element[1].value; 
intergers[2] = document.forms[0].element[2].value; 
intergers[3] = document.forms[0].element[3].value; 
intergers[4] = document.forms[0].element[4].value; 
for (i=0; i<intergers.length; i++) { 
    total += intergers[i]; 
    } 
return total; 
document.write("The total for the intergers entered is " + total + "."</p>); 
} 

/* ]]> */ 
</script><strong>Please enter an interger into each of the following text boxes.<br /> 
Press the Submit button to see a total of all the intergers.</strong></p> 
<form action="" name="intergers" onsubmit="addNums();" >  
<p>1st Interger<br/> 
    <input type="text" name="num1" value="" size="10" /></p> 
<p>2nd Interger<br/> 
    <input type="text" name="num2" value="" size="10" /></p> 
<p>3rd Interger<br/> 
    <input type="text" name="num3" value="" size="10" /></p> 
<p>4th Interger<br/> 
    <input type="text" name="num4" value="" size="10" /></p> 
<p>5th Interger<br/> 
    <input type="text" name="num5" value="" size="10" /></p> 
<p><input type="button" name="submit" value="Submit" /></p> 
</form> 
</body> 
</html>`enter code here`

來源

2013-10-11 airdon1

首先，你有你的所有整數額外[R！ :-)

代碼的一個問題是輸入值總是字符串，並且JavaScript使用+來進行數字添加和字符串連接。您可以選擇添加他們之前，強制所有的值轉換爲數字：

for (i=0; i<intergers.length; i++) { 
    total += parseInt(intergers[i], 10); 
}

或

for (i=0; i<intergers.length; i++) { 
    total += +intergers[i], 10; 
}

編輯：還有其他的一些問題，我才意識到......他們中的一些：

請勿在腳本標記中使用type="javascript"，只要將其刪除即可。
document.forms[0]上沒有element財產。那應該是elements。
你的按鈕也將被列爲其中一個元素...
你必須防止您的形式從subitting，否則你將永遠不會看到的結果是
你試圖在上下文中使用document.write在那裏它是雙重錯誤的：頁面已經被加載（所以它會在輸出之前擦除整個頁面），並且你試圖在return語句（其中沒有代碼可達）之後調用它。
對document.write的調用中還有一個</p>，這會導致語法錯誤。
提示：打開瀏覽器的開發人員工具，並始終檢查控制檯是否有錯誤。

來源

2013-10-11 21:43:06 bfavaretto

你對你的第一點http://www.w3.org/TR/xhtml1/diffs.html是非常錯誤的。只是因爲瀏覽器「糾正」即轉換爲HTML，您應該首先編寫html或正確執行xhmtl。 – jeff

好的，我意識到關於CDATA的部分是不正確的，我刪除了它。無論如何，我認爲OP僅使用XHTML文檔類型，因爲他從其他地方複製/粘貼了結構。建議使用HTML5（甚至是HTML4嚴格）。 – bfavaretto

Javascript表單元素添加到數組，然後總計元素

回答

相關問題