Angualr 实现复选框全选功能
html
<html lang="en">
<head>
<meta charset="UTF-8">
<title>document</title>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script src="http://cdn.static.runoob.com/libs/angular.js/1.4.6/angular.min.js"></script>
</head>
<body ng-app="myApp">
<div ng-controller="mainCtrl">
<label>全选<input type="checkbox" ng-model="selectAll" ng-click="all(selectAll)"></label><br/>
<div ng-repeat="person in persons" class="items">
<label>{{person.name}}:<input type="checkbox" ng-checked="person.state" ng-model="person.state" ng-click="every()"> </label><br/>
</div>
<!-- <div>selectAll : {{selectAll}}</div>
<div ng-repeat="person in persons">
{{person.name}} : {{person.state}}
</div> -->
</div>
<body>
js
angular.module("myApp",[])
.controller("mainCtrl", function ($scope) {
$scope.selectAll=false;
$scope.all= function (m) {
for(var i=0;i<$scope.persons.length;i++){
$scope.persons[i].state=m;
}
};
$scope.every = function(){
for(var i=0;i<$scope.persons.length;i++){
if($scope.persons[i].state==false){
$scope.selectAll=false;
return;
}
$scope.selectAll=true;
}
};
$scope.persons=[
{name:"a",state:false},
{name:"b",state:false},
{name:"c",state:false},
{name:"d",state:false}
]
});
Angualr 实现复选框全选功能的更多相关文章
- JavaScript小例子：复选框全选
JavaScript小例子:复选框全选 这只是一个小例子,很简单,但是这个功能还是很常用的: 实现后效果如图: JavaScript代码: <script type="text/jav ...
- vue+vant-UI框架写的购物车的复选框全选和反选
购物车页面的设计图 商品的列表 代码: <ul v-if="shoppingListData.rows.length"> <li v-for="(ite ...
- js 复选框 全选都选 如果某一个子复选框没选中 则全选按钮不选中
<!DOCTYPE HTML> <html> <head> <meta charset=UTF-8> <title>js 复选框 全选都选 ...
- Jquery表格变色 复选框全选，反选
/*jquery静态表格变色*/ $(".tr2").mouseover(function(){ $(this).css("background"," ...
- 复选框全选、全不选和反选的效果实现VIEW:1592
<html> <head> <meta http-equiv="Content-Type" content="text/html; char ...
- html+css+js实现复选框全选与反选
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/ ...
- checkbox复选框全选批量删除
多选框全选实现批量删除 html代码 <body> <form action="" method="post" name="Form ...
- toFixed（）精度丢失；复选框全选、取消
一.精度丢失和重写toFixed()函数 1.重写toFixed() Number.prototype.toFixed = function(length){ var carry = 0; //存放进 ...
- jQuery 复选框全选/取消全选/反选
jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...
- js 判断 复选框全选、全不选、反选、必选一个
一个挺 使用的 js 代码片段, 判断 复选框全选.全不选.反选.必选一个 记录下, 搬来的 思路: 修改数据的 选中与否状态, 拿到所有的输入框,看是否有选中的状态 <html> & ...
随机推荐
- poj 2411 Mondriaan's Dream 骨牌铺放 状压dp
题目链接 题意 用\(1\times 2\)的骨牌铺满\(H\times W(H,W\leq 11)\)的网格,问方案数. 思路 参考focus_best. 竖着的骨牌用\(\begin{pmatri ...
- PE笔记之PE文件总览图
- window golang1.12.4 安装配置&IDE vscode
step 1:下载golang golang官网地址是 https://golang.org/dl/ 如果没有墙的话,可以用这个地址 https://golang.google.cn/dl/ 如图: ...
- json手动解析详解
项目中有时候仅仅需要一个或者多个字段时可以使用这种解析方式,省去创建实体类. 1.首先讲解下最基本的数据格式. 例如: String json="{'name':'小明','action': ...
- HTML5-contentEditable属性规定是否可编辑元素的内容
contentEditable='true' :可以编辑 contentEditable='false' :不可以编辑
- 51nod 1006 最长公共子序列Lcs 【LCS/打印path】
1006 最长公共子序列Lcs 基准时间限制:1 秒 空间限制:131072 KB 分值: 0 难度:基础题 收藏 关注 给出两个字符串A B,求A与B的最长公共子序列(子序列不要求是连续的). ...
- Azure CDN 服务详解
Azure CDN概述 Azure CDN(内容分发网络)是一种用于分发高带宽内容的全球CDN解决方案,它可以托管在Azure中,也可以通过在任何其他位置,借助Azure CDN,可以托管到任何其 ...
- [LOJ6235]区间素数个数
题目大意: 给定$n(n\leq10^{11})$,求$\pi(n)$. 思路: 计算$\pi$函数有$O(n^{\frac23})$的Lehmer算法,这里考虑$O(\frac{n^{\frac34 ...
- （持续集成）win7上部署Jenkins+MSBuild+Svn+SonarQube+SonarQube Scanner for MSBuild （一）
一.Jenkins介绍 jenkins是一个广泛用于持续构建的可视化web工具,持续构建说得更直白点,就是各种项目的”自动化”编译.打包.分发部署.jenkins可以很好的支持各种语言(比如:java ...
- MySQL复制表结构和内容到另一张表（转）
MySQL不要看它小,一个开源的产物,要学习它的东西真的很多.而它的一切是SQL Server无法比拟的. 复制表结构及数据到新表 create table 新表 select * from 旧表 只 ...