注意引入jquery.js文件:百度搜索jquery,点击进入找到jquery-3.2.1.min.js,引入自己的文件中。
<script src="jquery-3.2.1.min.js"></script>
<script>
// 六个触发事件地方
// 全选 单选 删除 删除所有 加 减
// 全选
$("#selectAll").click(function(){
$(".checkt").prop("checked", this.checked);
change();
})
// 单选
$(".checkt").click(function(){
change();
})
// 删除
$(".proDel").click(function(){
$(this).parents("tr").remove();
change();
})
// 删除所有
$(".delAll").click(function(){
$(".checkt:checked").parents("tr").remove();
change();
})
// 加减
$(".ys").click(function(){
// 改变数量
var _this = this;
$(this).siblings(".count").val(function(index, value){
var res = parseInt(value) + parseInt(_this.value + 1)
return res == -1 ? 0 : res;
})
// 改变小计
$(this).parents("tr").find(".proMoney span").html(function(){
return $(_this).siblings(".count").val() * $(this).parents("tr").find(".proPirce span").html();
})
change();
})
// 改变合计和件数的方法
function change(){
$("#selectAll").prop("checked", $(".checkt:checked").length == $(".checkt").length);
// 改变件数
$(".proTotal span").html($(".checkt:checked").length);
// 改变合计
$(".totalPirces span").html(function(){
var pic = 0;
$(".checkt:checked").parent().siblings(".proMoney").children().each(function(index, el){
pic += parseInt(el.innerHTML);
})
return pic;
})
}
</script>
---------------------
jquery购物车
最新推荐文章于 2020-08-09 17:06:23 发布