摘要:本篇教程介绍了jQuery如何全选、取消全选和单选,希望阅读本篇文章以后大家有所收获,帮助大家对jQuery的理解更加深入。
本篇教程介绍了jQuery如何全选、取消全选和单选,希望阅读本篇文章以后大家有所收获,帮助大家对jQuery的理解更加深入。
<
<!--html-->
<table class="table1">
<thead>
<tr>
<th> <input id="flag" type="checkbox" ng-model="select_all" ng-change="selectAll()"> </th>
<th>合同编号</th>
<th>合同名称</th>
<th>分配公司</th>
<th>更新时间</th>
</tr>
</thead>
<tbody>
<tr ng-repeat="list in lists">
<td> <input type="checkbox" ng-model="list.checked" ng-change="selectOne()"> </td>
<td>{{list.contractnum}}</td>
<td>{{list.template.name}}</td>
<td>{{list.office.name}}</td>
<td>{{list.updateDate}}</td>
</tr>
</tbody>
</table>
<!--js-->
$scope.checked = [];//用来存放选中项的id
$scope.select_all = “”;
$scope.list = {
checked: “”
}
//全选
$scope.selectAll = function() {
if($scope.select_all) {
$scope.checked = [];
angular.forEach($scope.lists, function(i) {
i.checked = true;
$scope.checked.push(i.id);
})
} else {
angular.forEach($scope.lists, function(i) {
i.checked = false;
$scope.checked = [];
})
}
};
//单选
$scope.selectOne = function() {
angular.forEach($scope.lists, function(i) {
var index = $scope.checked.indexOf(i.id);
if(i.checked && index === -1) {
$scope.checked.push(i.id);
} else if(!i.checked && index !== -1) {
$scope.checked.splice(index, 1);
};
})
if($scope.lists.length === $scope.checked.length) {
$scope.select_all = true;
} else {
$scope.select_all = false;
}
}
本文由职坐标整理并发布,希望对同学们有所帮助。了解更多详情请关注职坐标WEB前端jQuery频道!
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了,明天再试试吧!
我们会在第一时间安排职业规划师联系您!
您也可以联系我们的职业规划师咨询:
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com,All Rights Reserved.
沪公网安备 31011502005948号