1200字范文,内容丰富有趣,写作的好帮手!
1200字范文 > input勾选框选中数据(全选 单选)

input勾选框选中数据(全选 单选)

时间:2020-08-08 20:06:43

相关推荐

input勾选框选中数据(全选 单选)

勾选列表数据

效果:

代码:

html:

<tr><th style="width:40px"><label class="ch_label"><input ng-model="select_all_resource" ng-change="selectAllResource()" type="checkbox" class="ch_all" /></label></th><th style="width:20%">名称<div class="resize"></div></th></tr>

<tr ng-repeat='item in courseList' ng-click="show_side(item)"><td ng-click="$event.stopPropagation();"><label class="ch_label"><input ng-model="item.checked" ng-change="selectOneResource()" type="checkbox" class="ch_item" /></label></td><td class="f_color {[item.is_import_color]}"><span style="position: relative;">{[item.name]}</span></td></tr>

js:

方式1:angular

// checkbox主资源列表$scope.checked_resource = [];$scope.selectAllResource = function () {if ($scope.select_all_resource) {$scope.checked_resource = [];angular.forEach($scope.resourceList, function (item) {//$scope.resourceList 代表列表数据item.checked = true;$scope.checked_resource.push(item.id);})} else {angular.forEach($scope.resourceList, function (item) {item.checked = false;$scope.checked_resource = [];})}}$scope.selectOneResource = function () {angular.forEach($scope.resourceList, function (item) {//$scope.resourceList 代表列表数据var index = $scope.checked_resource.indexOf(item.id);if (item.checked && index === -1) {$scope.checked_resource.push(item.id);} else if (!item.checked && index !== -1) {$scope.checked_resource.splice(index, 1);};})if ($scope.resourceList.length === $scope.checked_resource.length) {$scope.select_all_resource = true;} else {$scope.select_all_resource = false;}}

方式二 jquery

$scope.select_row = [];$scope.sel_user_all = function() {$scope.select_row = [];var check_all = $("#check_all")if (check_all.is(":checked")) {$(".check_item").prop("checked", true)} else {$(".check_item").prop("checked", false)}var item_tds = $(".check_item:checked");for (var n = 0; n < item_tds.length; n++) {$scope.select_row.push(item_tds.eq(n).val())}}$scope.sel_user_one = function() {$scope.select_row = [];var item_tds = $(".check_item:checked");for (var n = 0; n < item_tds.length; n++) {$scope.select_row.push(item_tds.eq(n).val())}var $select_arr_l = $scope.select_row.length;var $all_arr_l = $scope.all_user_data.length;if ($select_arr_l == $all_arr_l) {$scope.couAll = true;} else {$scope.couAll = false;}}

本内容不代表本网观点和政治立场,如有侵犯你的权益请联系我们处理。
网友评论
网友评论仅供其表达个人看法,并不表明网站立场。