原理:用jquery取得叠加的数据,将其放进数组里面,最后一个一个读取出来,实现叠加。
1、这个方法适合于对个input
$('input[name="number"]').live('blur',function(){
var valueArr= $('input[name="number"]');
var sumValue=0;
if(valueArr.size()>0||valueArr != null){
for (var i=0;i<valueArr.size();i++ )
{
//alert(valueArr[i].value);
if(isNaN(valueArr[i].value)||valueArr[i].value==null||valueArr[i].value==""){
sumValue +=0;
}
else{
//alert(valueArr[i].value);
sumValue +=parseFloat(valueArr[i].value);//强制转换为数字
}
}
}
if(sumValue>0){
$('#test').val(parseInt(sumValue));
}
else{
$('#test').val(0);
}
});
2、在上面方法的启示下,最近弄了一个checkbox的的自动累加。
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" lang="zh-CN">
<head>
<title>测试</title>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<meta name="description" content="" />
<meta name="keywords" content="" />
<script src="jquery-1.11.3.min.js"></script>
<script type="text/javascript">
$(function(){
var chkItem = $('input[name=chkItem]');
chkItem.click(function(){
$('#sumid').html(sum());
});
});
/**
*@功能 计算总和
*@param null
*@return int
**/
function sum(){
var valueArr= $('input[name=chkItem]');
var sumValue=0;
valueArr.each(function(index, element) {
if($(this).is(":checked")){
if(isNaN(valueArr[index].value)||valueArr[index].value==null||valueArr[index].value==""){
sumValue +=0;
}else{
sumValue +=parseFloat(valueArr[index].value);//强制转换为数字
}
}
});
if(sumValue>0){
sumValue = parseInt(sumValue);
}
else{
sumValue = 0;
}
return sumValue;
}
</script>
<style type="text/css">
</style>
</head>
<body>
<input name="chkItem" type="checkbox" value="1" />1
<input name="chkItem" type="checkbox" value="2" />2
<input name="chkItem" type="checkbox" value="3" />3
<br />
总和:<spam id="sumid"></span>
</body>
</html>