您的位置:首页 > 编程语言 > Go语言

Goods:购物车模块之全选按钮与条目之复选按钮的click事件

2015-09-06 15:14 405 查看
<script type="text/javascript">
/*
计算总计方法
*/
$(function() {

showTotal(); //文档加载完就计算总计

//给全选添加click事件
$("#selectAll").click(function() {
//获取全选的状态
var bool = $("#selectAll").attr("checked");
//让所有的条目的复选框与全选按钮状态同步
setItemCheckBox(bool);
//让结算按钮与全选的状态同步
setJieSuan(bool);

//重新计算总计
showTotal();

});

//给所有的条目的复选框添加click事件
$(":checkbox(name=checkboxBtn)").click(function() {

//所有条目的个数拿出来
var all = $(":checkbox[name=checkboxBtn]").length;
//选中的数目拿出来
var select = $(":checkbox[name=checkboxBtn][checked=true]").length

if (all == select) {
//勾选全选按钮
$("#selectAll").attr("checked", true);
setJieSuan(true);
} else if (select == 0) {
$("#selectAll").attr("checked", false);
setJieSuan(false);

} else {
$("#selectAll").attr("checked", false);
setJieSuan(true);
}
showTotal();

});

});

function showTotal() {
var total = 0;
//1获取所有被勾选的复选块
$(":checkbox[name=checkboxBtn][checked=true]").each(function() {
//2获取复选块的值 即cartItemid
var id = $(this).val();
//3再通过cartItemId找到小计 获取内容
var text = $("#" + id + "Subtotal").text();
//4累加操作  字符串累加 会越变越长
total += Number(text);

});
//5总计显示在总计元素
$("#total").text(total);

}

//统一设置所有条目的复选按钮
function setItemCheckBox(bool) {
$(":checkbox[name=checkboxBtn]").attr("checked", bool);

}

//设置结算按钮样式
function setJieSuan(bool) {
if (bool) {
$("#jiesuan").removeClass("kill").addClass("jiesuan");
//把之前的事件注销掉
$("#jiesuan").unbind("click"); //撤销当前元素所有的click事件
} else {
//设置样式 在css中有样式
$("#jiesuan").removeClass("jiesuan").addClass("kill");
//设置超链接不可用 click返回false
$("#jiesuan").click(function() {
return false;
});
}

}
</script>
内容来自用户分享和网络整理,不保证内容的准确性,如有侵权内容,可联系管理员处理 点击这里给我发消息
标签: