使用JQuery,我用复选框值填充了一个数组。然后,我创建了for循环来循环遍历数组,将复选框值解析为整数,求和,并将值分配给变量"total"。当我运行这个时,我得到的不是一个数字,我怀疑循环出了问题。有人能告诉我我在这里做错了什么吗。请原谅我,如果我的编码没有达到应有的干净程度,我只是从JS开始。
// create array and push selected checkbox values to it
var allVals = [];
$('input:checkbox[name=brand]:checked').each(function() {
allVals.push($(this).val());
//allVals.map(number);
});
for (var i=0; i < allVals.length; i++) {
var total
allVals[i] = parseInt(allVals[i]);
total += allVals[i] << 0;
alert(total);
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.1/jquery.min.js"></script>
您在for
中声明total
,因此每次都会重置它-我修改了您的代码一点,但这应该有效:
var numbers = $('input:checkbox[name=brand]:checked').map(function() {
return isNaN(this.value) ? 0 : this.value;
}).get();
var total = 0;
for (var i = 0; i < numbers.length; i++) {
total += numbers[i];
}
alert(total);
可以简单到:
$('[type=checkbox]').on('click', sum);
function sum(e) {
var total = $('[type=checkbox]:checked')
.toArray()
.reduce( function (a,b) {return a + +b.value;}, 0 );
$('[data-sum]').attr('data-sum', total.toFixed(2));
}
[data-sum] {
border-top: 1px solid #c0c0c0;
width: 100px
}
[data-sum]:before {
content: ' 3A3 'attr(data-sum);
padding-left: 4px;
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/2.1.1/jquery.min.js"></script>
<input type="checkbox" value="23.23"> 23.23<br>
<input type="checkbox" value="3.33"> 3.33<br>
<input type="checkbox" value="15.00"> 15.00<br>
<input type="checkbox" value="1101.22"> 1101.22<br>
<input type="checkbox" value="78.10"> 78.10<br>
<input type="checkbox" value="122.05"> 122.05<br>
<input type="checkbox" value="435.00"> 435.00<br>
<div data-sum="0"></div>
首先,您必须在for循环之外创建总变量然后将其初始化为零
var total = 0;
for (var i=0; i < allVals.length; i++) {
allVals[i] = parseInt(allVals[i],10);
total += allVals[i];
console.log(total);
}
秒因为您正在向未初始化的变量添加数字你得到了一个NaN结果
例如
var c;
c +=1; //this will be NaN(not a numeric number)
原因是当您初始化变量时,JavaScript知道正确的数据类型
应该给变量