问答详情
源自：6-11 编程练习

这段代码的反选功能为什么实现不了，我自己写的，希望哪个大神帮我一下忙，看看，我做的三个实现复选框选定问题是否对啊

<!DOCTYPE html>
{__NOLAYOUT__}
<html lang="en">
<head>
   <meta charset="UTF-8">
   <title>Title</title>
</head>
<body>
<form action="" role="form">
   <input type="checkbox" class="form-control" id="a1">
   <input type="checkbox" class="form-control" id="a2">
   <input type="checkbox" class="form-control" id="a3">
   <input type="checkbox" class="form-control" id="a4">
   <button type="button" class="btn btn-default" id="btn1">反选</button>
   <button TYPE="button" class="btn btn-default" id="btn2">全选</button>
   <button TYPE="button" class="btn btn-default" id="btn3">不选</button>
</form>
<script type="text/javascript" src="jquery-1.12.0.js"></script>
<script type="text/javascript">
$('#btn2').on('click',function(){
for(var i=0;i<$(".form-control").length;i++){
$('.form-control').prop('checked',true);
       }
   });
   $('#btn3').on('click',function(){
for (var i=0;i<$(".form-control").length;i++){
$(".form-control").prop('checked',false);
       }
   });
   $('#btn1').on('click',function(){

var flag = $('.form-control').is(':checked');

           if (flag==true) {
$('.form-control').prop('checked', false);
           } else {

$('.form-control').prop('checked', true);
           }
        });
</script>
</body>
</html>

提问者：鸭梨同学 2016-01-11 10:10

个回答

  • 伊望岁月
    2016-01-11 10:19:58
    已采纳 

    $('#btn1').on('click',function(){
    var flags = $('.form-control');
    for(var i = flags.length; i--;){
      var $flag = $(flags[i]);
      var val = $flag.prop('checked');
      $flag.prop('checked', !val);
    }
});

    反选功能改成这样吧，你的代码思路有点问题，没有对所有checkbox进行遍历

    0