这个代码中一次点击全选就可以，再次点击就选中不了了，请问哪位大神帮忙补充一下
0
[待解决问题]
<!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
.selected{
}
</style>
<script src="js/jquery-1.11.3.js"></script>
<script>
$(function() {
$("#checkAll").click(function() {
$('input[name="subBox"]').attr("checked",this.checked);
});
var $subBox = $("input[name='subBox']");
$subBox.click(function(){
$("#checkAll").attr("checked",$subBox.length == $("input[name='subBox']:checked").length ? true : false);
});
});
</script>
</head>
<body>
<div>
<input id="checkAll" type="checkbox"/>全选
<input name="subBox" type="checkbox"/>项1
<input name="subBox" type="checkbox"/>项2
<input name="subBox" type="checkbox"/>项3
<input name="subBox" type="checkbox"/>项4
</div>
</body>
</html>
所有回答(3)
0
$(function() { $('#checkAll').click(function() { $('input[name="subBox"]').prop('checked', this.checked); }); var $subBox = $('input[name="subBox"]'); $subBox.click(function(){ $('#checkAll').prop('checked', $subBox.length == $('input[name="subBox"]:checked').length ? true : false); }); });
那我想然让选中的那一项字体变色呢，怎么写
@前端学步:
<!DOCTYPE html> <html> <head lang="en"> <meta charset="UTF-8"> <title></title> <style> .selected{ color: red; } </style> <script src="https://ajax.googleapis.com/ajax/libs/jquery/2.2.4/jquery.min.js"></script> <script> $(function() { $('#checkAll').click(function() { $('input[name="subBox"]').prop('checked', this.checked); ChangeSelected(); }); var $subBox = $('input[name="subBox"]'); $subBox.click(function(){ $('#checkAll').prop('checked', $subBox.length == $('input[name="subBox"]:checked').length ? true : false); ChangeSelected(); }); }); function ChangeSelected() { $('[name="subBox"]').each(function() { if (this.checked) { $(this).next('[name="title"]').addClass('selected'); } else { $(this).next('[name="title"]').removeClass('selected'); } }) } </script> </head> <body> <div> <input id="checkAll" type="checkbox"/>全选 <input name="subBox" type="checkbox"/><span name="title">项1</span> <input name="subBox" type="checkbox"/><span name="title">项2</span> <input name="subBox" type="checkbox"/><span name="title">项3</span> <input name="subBox" type="checkbox"/><span name="title">项4</span> </div> </body> </html>
@RosonJ: <!DOCTYPE html>
<html>
<head lang="en">
<meta charset="UTF-8">
<title></title>
<style>
.hide{
display: none;
}
.show{
display: block;
}
</style>
</head>
<body>
<div>
<div class="b-1">
<div class="hang"> <span class="jian">-</span>aaa</div>
<div class="show">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
</div>
<div class="b-1">
<div class="hang"> <span class="jian">-</span>aaa</div>
<div class="show">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
</div>
<div class="b-1">
<div class="hang"> <span class="jian">+</span>aaa</div>
<div class="hide">
<ul>
<li>1</li>
<li>2</li>
<li>3</li>
</ul>
</div>
</div>
</div>
</body>
</html>
非常感谢在您刚刚发过来的时候我做出来了，最近的一个项目遇见了这个内容，其实我经常做，我只是想通过<span>-</span>的文本内容做判断做出这个点击展开隐藏的效果，但是一直做的不对，相信你懂 我的意思
@前端学步:
在另一個問題回覆你了
0
attr换成prop
0
给你看一个网址吧，希望能对你有帮助 http://www.cnblogs.com/xibianriluo/p/5489271.html
