Jquery和angularjs获取check框选中的值的方法汇总

在我们平常的开发中，有时候会需要获取一下check框选中的值，以及check框选中行的所有信息。这个时候有一个小技巧那就是我们可以把要获取的信息全部放到check框的值里面，这样我们可以获取check框选中值的时候也就相当于获取了当前行的信息。
复制代码代码如下:
<td><input class="states" type="checkbox" name="orders" value="{{e.merchantId}},{{e.orderCode}},{{e.userId}}"/></td>

全选全不选：

var bischecked=$（"#cboxchecked"）.is（":checked"）; var fruit=$（"input[name="orders"]"）; fruit.prop（"checked",bischecked）;

这里为什么要用prop而不用attr,这是因为
对于HTML元素本身就带有的固有属性，在处理时，使用prop方法。
对于HTML元素我们自己自定义的DOM属性，在处理时，使用attr方法。
获取选中的值:

$（"input[name="orders"]:checked"）.each（function（）{ var sfruit=$（this）.val（）; var orders=sfruit.split（","）; var reminder=new Object（）; reminder.merchantId=orders[0]; reminder.orderCode=orders[1]; reminder.userId=orders[2]; }）;

angularjs实现:
使用angularjs我们不用去操作dom,我们只需要去关心这个值的状态;
首先看一下html代码：

<！DOCTYPE html><html data-ng-app="App"><head><script type="text/javascript" src="https://ajax.googleapis.com/ajax/libs/angularjs/1.0.8/angular.min.js"></script><script src="script2.js"></script></head><body data-ng-controller="AddStyleCtrl"><div>Choose Tags</div><div><div>You have choosen:</div><hr><label data-ng-repeat="selectedTag in selectedTags">（（{{selectedTag}}））</label><hr><div data-ng-repeat="category in tagcategories"><div>{{ category.name }}</div><div data-ng-repeat="tag in category.tags"><div><input type="checkbox" id={{tag.id}} name="{{tag.name}}" ng-checked="isSelected（tag.id）" ng-click="updateSelection（$event,tag.id）">{{ tag.name }}</div></div><hr></div></div><pre>{{selected|json}}</pre><pre>{{selectedTags|json}}</pre></body></html>

line2 定义了AngularJS App；
line4 引入angularjs脚本；
line5 引入自己写的script2.js脚本；
line7 指定控制器AddStyleCtrl
line13-15 实时显示已选标签给用户看；
line17-line26 使用双重循环列出数据库（本例中就存储在了controller的一个对象里）中的数据；
line21的这行代码作用可大了：<inputtype="checkbox" id={{tag.id}}name="{{tag.name}}" ng-checked="isSelected（tag.id）" ng-click="updateSelection（$event,tag.id）">
存储了tag的id，name，利用isSelected（tag.id）来判断是否被checked，点击时候调用updateSelection（$event,tag.id）方法；
如果想 ng-click 触发的函数里获取到该触发该函数的元素不能直接传入 this ，而需要传入event。因为在Angularjs里面，这个地方的this是 scope 。我们可以传入 event，然后在函数里面通过 event.target 来获取到该元素。
line29-30 是测试时候给自己看的，可以看到selected数组和selectedTags数组中的内容；
然后看看AngularJS代码：（script2.js）

/*** Created by zh on 20/05/15.*/ // Code goes herevar iApp = angular.module（"App", []）; iApp.controller（"AddStyleCtrl", function（$scope） { $scope.tagcategories = [ { id: 1, name: "Color", tags: [ { id:1, name:"color1" }, { id:2, name:"color2" }, { id:3, name:"color3" }, { id:4, name:"color4" }, ] }, { id:2, name:"Cat", tags:[ { id:5, name:"cat1" }, { id:6, name:"cat2" }, ] }, { id:3, name:"Scenario", tags:[ { id:7, name:"Home" }, { id:8, name:"Work" }, ] } ];$scope.selected = []; $scope.selectedTags = [];var updateSelected = function（action,id,name）{ if（action == "add" && $scope.selected.indexOf（id） == -1）{ $scope.selected.push（id）; $scope.selectedTags.push（name）; } if（action == "remove" && $scope.selected.indexOf（id）！=-1）{ var idx = $scope.selected.indexOf（id）; $scope.selected.splice（idx,1）; $scope.selectedTags.splice（idx,1）; } }$scope.updateSelection = function（$event, id）{ var checkbox = $event.target; var action = （checkbox.checked?"add":"remove"）; updateSelected（action,id,checkbox.name）; }$scope.isSelected = function（id）{ return $scope.selected.indexOf（id）>=0; } }）;