JS实现全选,取消全选,正常选择
//点击选择方法
onUserIdsChange(selVal) {
if (this.form.groupUserIds.includes(-1) && !this.isSelectAll) {
// 全选
this.nickNames = []
this.isSelectAll = true
this.form.groupUserIds = []
this.groupUserOption.forEach(item => {
item.value != -1 && this.form.groupUserIds.push(item.value)
if(this.form.groupUserIds.length !== 0 && item.subscribe !== true){
this.onShow = true
this.nickNames.push(item.label)
}
})
this.groupUserOption[0].label = '取消全选'
} else if (this.isSelectAll && this.form.groupUserIds.includes(-1)) {
**// 取消全选**
this.isSelectAll = false
this.groupUserOption[0].label = '全选'
this.form.groupUserIds = []
this.onShow = false
this.nickNames = []
} else {
**// 正常选择**
this.nickNames = []
this.form.groupUserIds = selVal
if(this.form.groupUserIds.length === this.groupUserOption.length - 1){
this.groupUserOption[0].label = '取消全选'
}else{
this.groupUserOption[0].label = '全选'
}
if(this.form.groupUserIds.length !== 0){
this.groupUserOption.forEach(item2 => {
this.form.groupUserIds.forEach(item => {
if(item2.value === item && item2.subscribe !== true){
this.onShow = true
this.nickNames.push(item2.label)
}else if(item2.value === item && item2.subscribe === true){
this.onShow = false
}
})
})
}
else{
this.onShow = false
this.nickNames = []
}
}
}
},
JS实现全选,取消全选,正常选择的更多相关文章
- jQuery--checkbox全选/取消全选
用JavaScript使页面上的一组checkbox全选/取消全选,逻辑很简单,实现代码也没有太难的语法.但使用jQuery实现则更简单,代码也很简洁,精辟! jQuery版本:1.3.2 <h ...
- AngularJS--购物车全选/取消全选功能实现
刚学习angularJS,于是练习写了一个类似于购物车的全选/取消全选的功能,主要实现的功能有: 1.勾选全选checkbox,列表数据全部被勾选,取消同理,用ng-model实现双向绑定: 2.选中 ...
- jQuery 复选框全选/取消全选/反选
jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...
- html checkbox 实现全选/取消全选
html checkbox 实现全选/取消全选 <html> <body> <table border="1"> <tr> < ...
- 【转载】checkbox实现全选/取消全选
比较简单.好理解的写法,做个备注.查看请前往原地址:http://blog.csdn.net/graceup/article/details/46650781 <html> <bod ...
- Jquery CheckBox复选框 全选/取消全选 最佳实现方式 参考案例
<input id="chkAll" type="checkbox" />全选/取消全选</div> <asp:Repeater ...
- checkbox全选/取消全选
//checkbox全选/取消全选 $(function() { $("#checkAll").click(function() { if(this.checked){ $(&qu ...
- Vue 全选/取消全选,反选/取消反选
这是一个组件: <template> <div> <div> <input type="checkbox" v-model="i ...
- vue实现功能 单选 取消单选 全选 取消全选
vue实现功能 单选 取消单选 全选 取消全选 代码部分 <template> <div class=""> <h1>全选框</h1> ...
- jquery checkbox勾选取消勾选的诡异问题
jquery checkbox勾选/取消勾选的诡异问题jquery checkbox勾选/取消勾选的诡异问题 <form> 你爱好的运动是?<input type=&q ...
随机推荐
- 刚开始用springboot踩的好多坑!!!
今天,刚开始就在刚才我留下了激动的泪水,因为我捯饬springboot已经有几天了,我通过看视频学的,但是坑实在是太多了,今年是鼠年~~~LOL----瘟疫之源来了, 被困在了老家不能走,老家网实在是 ...
- Update(Stage4):sparksql:第3节 Dataset (DataFrame) 的基础操作 & 第4节 SparkSQL_聚合操作_连接操作
8. Dataset (DataFrame) 的基础操作 8.1. 有类型操作 8.2. 无类型转换 8.5. Column 对象 9. 缺失值处理 10. 聚合 11. 连接 8. Dataset ...
- 对list集合的内容分组
/** * 把list集合里的内容按照len大小分组 * @param list * @param len * @return */ private static List<List<St ...
- Vulnhub_DC1 记录
目录 Vulnhub_DC1 记录 经验 & 总结 步骤流水 1. 建立立足点 2. 提权 3. 主机信息搜集 4. 继续提权 5. 消失的flag Vulnhub_DC1 记录 参考walk ...
- 使用KVC键值编码
掌握KVC从不使用setter.getter.点语法开始. ----- 前言 对象的内部状态是由属性进行封装的.访问对象属性的方式平时在开发过程中用得最多的是getter方法和点语法.键值编程KVC也 ...
- Java基础知识笔记第六章:接口
接口 /* 使用关键字interface来定义一个接口.接口的定义和类的定义很相似,分为接口声明和接口体 */ interface Printable{ final int max=100; void ...
- Pytorch本人疑问(2)model.train()和model.eval()的区别
我们在训练时如果使用了BN层和Dropout层,我们需要对model进行标识: model.train():在训练时使用BN层和Dropout层,对模型进行更改. model.eval():在评价时将 ...
- [转载]android 显示多选列表对话框setMultiChoiceItems
public class MultiChoiceItemsTest extends Activity implements OnClickListener { private String[] pro ...
- Linux centos7iptables filter表案例、iptables nat表应用
一.iptables filter表案例 vim /usr/local/sbin/iptables.sh 加入如下内容 #! /bin/bash ipt="/usr/sbin/iptable ...
- 6(计算机网络) 交换机与VLAN
拓扑结构是怎么形成的? 我们常见到的办公室大多是一排排的桌子,每个桌子都有网口,一排十几个座位就有十几个网口,一个楼层就会有几十个甚至上百个网口.如果算上所有楼层,这个场景自然比你宿舍里的复杂多了.具 ...