您的位置:首页 > 其它

Dom-全选商品列表示范

2016-06-05 22:27 411 查看
web-strom开发

1.简单商品列表的全选

<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<script>
function getSum(){
/*获取名称为item的复选框
判断check状态,为true表示被选中
* */
var sum=0;
var collItemNodes=document.getElementsByName("item");
for(var i=0;i<collItemNodes.length;i++){
if(collItemNodes[i].checked){
sum+=parseInt(collItemNodes[i].value);
}
}
var sSum=sum+"元";
document.getElementById("sid").innerHTML=sSum.fontcolor('red');
}
//全选
function checkall(node){
//将全选的box的checked状态赋值给所有的itembox的checked
var collItemNodes=document.getElementsByName("item");
for(var i=0;i<collItemNodes.length;i++){
collItemNodes[i].checked=node.checked;
}
}
</script>
</head>
<body>
<input type="checkbox" name="allitem" onclick="checkall(this)"/>全选<br/>
<input type="checkbox" name="item" value="5000"/>笔记本电脑 4000元<br/>
<input type="checkbox" name="item" value="5000"/>笔记本电脑 4000元<br/>
<input type="checkbox" name="item" value="5000"/>笔记本电脑 4000元<br/>
<input type="checkbox" name="item" value="5000"/>笔记本电脑 4000元<br/>
<input type="checkbox" name="item" value="5000"/>笔记本电脑 4000元<br/>
<input type="button" value="总金额是" onclick="getSum()"/><span id="sid"></span>
</body>
</html>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: