JS点击全选，判断是否全选等操作

admin · 发表于 2016-3-16 22:27:28

html

<form class="form-horizontal form group_post_form" method="post" enctype="multipart/form-data">
<div class="panel panel-default">
<div class="panel-heading">
编辑账号身份
</div>
<div class="panel-body">
<div class="form-group">
<label class="col-xs-12 col-sm-2 col-md-2 col-lg-2 control-label">名称</label>
<div class="col-sm-8 col-md-8 col-xs-12">
<input class="form-control" name="title" type="text" value="管理员">
</div>
</div>
<div class="form-group">
<label class="col-xs-12 col-sm-2 col-md-2 col-lg-2 control-label">权限</label>
<div class="col-sm-8 col-md-8 col-xs-12">
<div class="panel panel-default">
<div class="panel-heading">
<div class="checkbox">
<label><input type="checkbox" class="permission_item">功能模块</label>
</div>
</div>
<div class="panel-body">
<div class="row">
<div class="col-xs-2 checkbox">
<label><input type="checkbox" name="permission[]" value="superman_mall_menu_seckill" >秒杀</label>
</div>
<div class="col-xs-2 checkbox">
<label><input type="checkbox" name="permission[]" value="superman_mall_menu_mgroupon" >拼团</label>
</div>
</div>
</div>
</div>
<div class="panel panel-default">
<div class="panel-heading">
<div class="checkbox">
<label><input type="checkbox" class="permission_item">商品管理</label>
</div>
</div>
<div class="panel-body">
<div class="row">
<div class="col-xs-2 checkbox">
<label><input type="checkbox" name="permission[]" >发布商品</label>
</div>
<div class="col-xs-2 checkbox">
<label><input type="checkbox" name="permission[]">出售中商品</label>
</div>
<div class="col-xs-2 checkbox">
<label><input type="checkbox" name="permission[]">已售罄商品</label>
</div>
<div class="col-xs-2 checkbox">
<label><input type="checkbox" name="permission[]">仓库中商品</label>
</div>
<div class="col-xs-2 checkbox">
<label><input type="checkbox" name="permission[]">禁售商品</label>
</div>
<div class="col-xs-2 checkbox">
<label><input type="checkbox" name="permission[]">商品规格</label>
</div>
<div class="col-xs-2 checkbox">
<label><input type="checkbox" name="permission[]">邮费模板</label>
</div>
<div class="col-xs-2 checkbox">
<label><input type="checkbox" name="permission[]">自提门店</label>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
</div>
<div class="form-group">
<div class="col-sm-12">
<input name="submit" type="submit" value="提交" class="btn btn-primary col-lg-1">
<input type="hidden" name="all" value="0">
</div>
</div>
</form>

复制代码

js

<script>
require(['jquery'], function($){
$('.permission_item').click(function(){
if ($(this).prop('checked')) {
$('input[type=checkbox]', $(this).parent().parent().parent().next()).prop('checked', true);
} else {
$('input[type=checkbox]', $(this).parent().parent().parent().next()).prop('checked', false);
}
});
$('.group_post_form').submit(function(){
var all_checked = 1;
$('input[name="permission[]"]').each(function(){
if (!$(this).prop('checked')) {
all_checked = 0;
return false;
}
all_checked = 1;
});
if (all_checked) {
$('input[name=all]').val('1');
} else {
$('input[name=all]').val('0');
}
return true;
});
});
</script>

复制代码

		自动登录	找回密码
密码			立即注册

[基础语法] JS点击全选，判断是否全选等操作

众神之神