checkbox 子级父级联动

本文主要是介绍checkbox 子级父级联动，希望对大家解决编程问题提供一定的参考价值，需要的开发者们随着小编来一起学习吧！

1.点击父级取消，子级全部取消；
2.点击任意一个子级checked，父级自动checked；
3.里面的value的值和内容自己根据情况修改，我这里是从后台拿到的数据；
<div class="checkWarp cWarpleft">
<input type="checkbox" name="" class="fuji checkSource" value="" />
<span class="fujiName_Source"></span>
<ul class="cWarpleftParent">
<li><i></i><input type="checkbox" class="ziji checkSource" value="'+L2Source[i].id+'" />'+L2Source[i].name+'</li>
                 <li><i></i><input type="checkbox" class="ziji checkSource" value="'+L2Source[i].id+'" />'+L2Source[i].name+'</li>
                  <li><i></i><input type="checkbox" class="ziji checkSource" value="'+L2Source[i].id+'" />'+L2Source[i].name+'</li>
</ul>
</div>
js:
$("body").find('.checkWarp .fuji').click(function (event) {
event.stopPropagation();
var isfuji_checked = $(this).is(':checked');
if (isfuji_checked == true) {
} else{
$(this).parents('.checkWarp').children('ul').children('li').children('.ziji').prop("checked",false);
   $("body .cWarprightParent").find(".ziji").each(function(index){   
  if($(this).val()=="3"){
    $(this).prop("checked",true);
    $(this).prop("disabled",true);
  }
})
}
})
$('.checkWarp .ziji').click(function (event) {
event.stopPropagation();
var isziji_checked = $(this).is(':checked');
if (isziji_checked == true) {
  $(this).parents('.checkWarp').children('.fuji').prop("checked",true);
} else{}
})

这篇关于checkbox 子级父级联动的文章就介绍到这儿，希望我们推荐的文章对编程师们有所帮助！

---