全选功能实现

全选:

/*全选按钮*/
function selectAll(e){//根据全选按钮的text值为条件判断
  var btC=$(e).text();
  var $check=$(".col-lg-12");
  var inp=$(".col-lg-12").find("label input[type=checkbox]");//获取所有checkbox的值
  if(btC == '全选'){
  $(e).text("反选");
  $check.addClass("js-check-bkg");
  $.each(inp,function(index){//遍历所有的checkbox
    inp[index].checked = true;//设置属性值
  });
}else if(btC == '反选'){
  $(e).text("全选");
  $check.removeClass("js-check-bkg");
  $.each(inp,function(index){
    inp[index].checked = false;//设置属性值
  });
}
}
/*single select*/
$(".js-check").on("click",function(){//根据所选择的checkbox的状态为条件判断
var $inp=$(this).find("label input[type=checkbox]");
var $check=$(".col-lg-12");
if( $(this).hasClass("js-check-bkg")){
$(this).removeClass("js-check-bkg");
$.each($inp,function(index){
   $inp[index].checked = false;
});
}else{
$(this).addClass("js-check-bkg");
$.each($inp,function(index){
   $inp[index].checked = true; 
});
}
});

猜你喜欢

转载自www.cnblogs.com/resist/p/9066294.html
今日推荐