問題總和字段

這是一個基本的html/javascript代碼，但我有問題獲得所有字段的總和。（的是在原有項目50場，但現在我剛剛離開5）問題總和字段

如果該字段爲空，它只是忽略它，並添加只有那些充滿領域。

HTML代碼：

value1:<input type="text" id="total_1" ><br> 
value2:<input type="text" id="total_2" ><br> 
value3:<input type="text" id="total_3" ><br> 
value4:<input type="text" id="total_4" ><br> 
value5:<input type="text" id="total_5" ><br> 
total:<input type="text" id="totalresult" > 
<button type="button" onclick="getTotal(); return false;">Get total</button>

的Javascript：

function getTotal() { 
var sum; 
for (i = 1; i <=5 ; i++) { 
    var total = document.getElementById('total_' + i.toString()).value; 
    if (total != '') { 
     sum = parseFloat(total) + sum; 
     document.getElementById('totalresult').value = sum; 
    } 

    } 

}

我不知道爲什麼我的代碼不能正常工作。

這是我Fiddle

來源

2013-04-11 Herland Cid

檢查我更新的答案。 – defau1t 2013-04-12 06:54:15

你需要做兩件事情。 1，初始化和爲零。 2，檢查輸入值是否爲數字。

function getTotal() { 
    var sum = 0; 
    for (i = 1; i <= 5; i++) { 
     var total = document.getElementById('total_' + i).value; 
     if (!isNaN(parseFloat(total))) sum = parseFloat(total) + sum; 
     document.getElementById('totalresult').value = sum; 
    } 
}

jsFiddle example

來源

2013-04-11 19:00:53 j08691

代碼第一次運行時，總和將是不確定的。

初始化

var sum = 0;

而且使其在撥弄工作，你需要改變

在onLoad左側頂部爲「不循環 - 在」

來源

2013-04-11 18:53:06

感謝回覆@ParthikGosar嘗試過，但問題仍然存在 – 2013-04-11 18:56:08

我不知道爲什麼你的小提琴不能想出讓getTotal成爲一個全球性的。但是你的主要問題是總和未定義爲開始。這將導致NaN（非數字）：

var sum; 

sum = 1 + sum; // NaN

....

sum = 1 + undefined; // NaN 

sum = 1 + NaN; // NaN

Demo at jsbin.com

你應該首先設置總和爲零：

var sum = 0; 
for (...) { ...

Working demo as adrianp pointed out: It would probably be more clear if you uploaded the working code to jsbin.

來源

2013-04-11 18:54:28 andlrc

如果您將工作代碼上傳到jsbin，可能會更清楚。 – adrianp 2013-04-11 19:02:57

您還沒有定義sum變量，所以javascript將其作爲NaN，這意味着不是數字。你需要初始化它來設置它。

function getTotal() { 
      var sum = 0; 
    for (i = 1; i <=5 ; i++) { 
    var total = document.getElementById('total_' + i.toString()).value; 
if(isNaN(total) || total.indexOf(' ') == 1) { 
    alert("Please type a number"); 
    document.getElementById("totalresult").value = "I cant sum alphanumerics"; 
    return false; 
} 

if (total != '') { 
    sum = parseFloat(total) + sum; 
    document.getElementById('totalresult').value = sum; 
}

}}

FIDDLE

來源

2013-04-11 18:55:47 defau1t

如果在字段中鍵入空格或非數字字符，則不起作用。 – j08691 2013-04-11 19:02:33

@ j08691很難相信OP正在考慮生產代碼。 – adrianp 2013-04-11 19:04:09

@ j08691：謝謝，我爲字母數字編輯了一些代碼。 – defau1t 2013-04-12 06:53:44

使用IsNumeric功能檢查輸入字段有一個有效的數字。請參閱：Validate decimal numbers in JavaScript - IsNumeric()

這裏是我的建議，以提高代碼中的for循環：

var elementValue = document.getElementById('total_' + i).value 
IsNumeric(elementValue) ? elementValue : elementValue = 0;

來源

2013-04-11 19:26:03 Deepak

問題總和字段

回答

相關問題