JS如何实现全选
最近在修改一个购物车功能，比我的购物车有多家商品，每一家有多个商品，我只要点击每一家店铺前面的复选框就可以全选该商家的所有购物车的商品，而购物车的其他家的商品就不全者，这...
最近在修改一个购物车功能，比我的购物车有多家商品，每一家有多个商品，我只要点击每一家店铺前面的复选框就可以全选该商家的所有购物车的商品，而购物车的其他家的商品就不全者，这样的JS代码要怎么来写？
展开
5个回答
展开全部
//不知道jquery可以吗，原理差不多
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<title>购物车</title>
<script src="../js/jquery-1.6.2.min.js" type="text/javascript"></script>
<script language="javascript" type="text/javascript">
$(function () {
$("#selectAll").click(function () {//全选
$("#AList :checkbox").attr("checked", true);
});
$("#unSelect").click(function () {//全不选
$("#AList :checkbox").attr("checked", false);
});
$("#reverse").click(function () {//反选
$("#AList :checkbox").each(function () {
$(this).attr("checked", !$(this).attr("checked"));
});
});
});
</script>
</head>
<body>
<!-- 该处以A商家的购物车为例 -->
<div id="A">
<input type="button" value="全选" id="selectAll" />
<input type="button" value="全不选" id="unSelect" />
<input type="button" value="反选" id="reverse" />
<div id="AList">
<input type="checkbox" value="商品1" />商品1<br />
<input type="checkbox" value="商品2" />商品2<br />
<input type="checkbox" value="商品3" />商品3<br />
<input type="checkbox" value="商品4" />商品4<br />
<input type="checkbox" value="商品5" />商品5<br />
</div>
</div>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
简单的如下，从后台读取数据的时候为每家店铺的商品单独加类
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<script src="https://cdn.bootcss.com/jquery/2.0.0/jquery.js"></script>
<title></title>
</head>
<body>
<div><input type="checkbox" class="classA"/>店铺：test1</div>
<div><input type="checkbox" name="nameA"/></div>
<div><input type="checkbox" name="nameA"/></div>
<div><input type="checkbox" name="nameA"/></div>
<div><input type="checkbox" name="nameA"/></div>
<div><input type="checkbox" name="nameA"/></div>
<div><input type="checkbox" class="classB"/>店铺：test2</div>
<div><input type="checkbox" name="nameB"/></div>
<div><input type="checkbox" name="nameB"/></div>
<div><input type="checkbox" name="nameB"/></div>
<div><input type="checkbox" name="nameB"/></div>
</body>
<script>
$(function(){
$(".classA").change(function(){
var status = $(".classA").prop("checked");
$("input[name='nameA']").attr("checked",status);
})
$(".classB").change(function(){
var status = $(".classB").prop("checked");
$("input[name='nameB']").attr("checked",status);
})
})
</script>
</html>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<body>
<input type="checkbox" onclick="allSelect()" /> 全选 <br />
<input type="checkbox" id="a" />1 <br />
<input type="checkbox" id="a" />2 <br />
<input type="checkbox" id="a" />3 <br />
<input type="checkbox" id="a" />4 <br />
</body>
<script>
function allSelect() {
if ($(":checkbox").attr("checked") ) {
$(":checkbox").attr("checked", "checked");
}
else {
$(":checkbox").removeAttr("checked");
}
}
</script>
本回答被网友采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
每家店的专属id赋值给该家店下的商品的class,点击全选，通过class来控制
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
$(“#nb~li”)//选取所有的弟弟
#nb 是一个商家的id值 即<ul id="nb"> 选取到之后 ~li是选取所有弟弟 >li选取子元素
这段代码意思就是 选取#nb下所有的li 如果回答不符追问 望采纳
#nb 是一个商家的id值 即<ul id="nb"> 选取到之后 ~li是选取所有弟弟 >li选取子元素
这段代码意思就是 选取#nb下所有的li 如果回答不符追问 望采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
更多回答（3）
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
