//点击选择方法

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实现全选,取消全选,正常选择的更多相关文章

  1. jQuery--checkbox全选/取消全选

    用JavaScript使页面上的一组checkbox全选/取消全选,逻辑很简单,实现代码也没有太难的语法.但使用jQuery实现则更简单,代码也很简洁,精辟! jQuery版本:1.3.2 <h ...

  2. AngularJS--购物车全选/取消全选功能实现

    刚学习angularJS,于是练习写了一个类似于购物车的全选/取消全选的功能,主要实现的功能有: 1.勾选全选checkbox,列表数据全部被勾选,取消同理,用ng-model实现双向绑定: 2.选中 ...

  3. jQuery 复选框全选/取消全选/反选

    jQuery实现的复选框全选/取消全选/反选及获得选择的值. 完整代码: <!DOCTYPE html> <html> <head> <script type ...

  4. html checkbox 实现全选/取消全选

    html checkbox  实现全选/取消全选 <html> <body> <table border="1"> <tr> < ...

  5. 【转载】checkbox实现全选/取消全选

    比较简单.好理解的写法,做个备注.查看请前往原地址:http://blog.csdn.net/graceup/article/details/46650781 <html> <bod ...

  6. Jquery CheckBox复选框 全选/取消全选 最佳实现方式 参考案例

    <input id="chkAll" type="checkbox" />全选/取消全选</div> <asp:Repeater ...

  7. checkbox全选/取消全选

    //checkbox全选/取消全选 $(function() { $("#checkAll").click(function() { if(this.checked){ $(&qu ...

  8. Vue 全选/取消全选,反选/取消反选

    这是一个组件: <template> <div> <div> <input type="checkbox" v-model="i ...

  9. vue实现功能 单选 取消单选 全选 取消全选

    vue实现功能 单选 取消单选 全选 取消全选 代码部分 <template> <div class=""> <h1>全选框</h1> ...

  10. jquery checkbox勾选取消勾选的诡异问题

    jquery checkbox勾选/取消勾选的诡异问题jquery checkbox勾选/取消勾选的诡异问题 <form>        你爱好的运动是?<input type=&q ...

随机推荐

  1. C语言-(void*)类型指针

    (void*)类型指针:ANSI新增的:即定义了一个指针,但不指定指向任何类型(即指向抽象的数据类型). 1 通过强制类型转换可将其值赋给另一指针变量 2.1用于动态存储函数的返回型指针 void m ...

  2. 区分移动端和pc端

    区分移动端和pc端: window.navigator.userAgent.toLowerCase().indexOf('mobile')== -1   判断  等于-1就是pc,false就是移动端 ...

  3. How2J学习java-1、环境配置

    JDK环境变量配置分下载,配置,验证三个步骤. 一.首先需要到JDK下载网站下载所需的JDK版本可根据更新来定.主流的开发工具Idear下载. 1.首先看配置成功后的效果 点WIN键->运行(或 ...

  4. LockSupport源码分析

    LockSupport提供park()和unpark()方法实现线程阻塞和唤醒.底层实现是通过sun.misc.Unsafe的park和unpark. 关于sun.misc.Unsafe的说明请参见我 ...

  5. 1014 Waiting in Line (30分)

    1014 Waiting in Line (30分)   Suppose a bank has N windows open for service. There is a yellow line i ...

  6. CVPR 2019 行人检测新思路:

    CVPR 2019 行人检测新思路:高级语义特征检测取得精度新突破 原创: CV君 我爱计算机视觉 今天 点击我爱计算机视觉置顶或标星,更快获取CVML新技术 今天跟大家分享一篇昨天新出的CVPR 2 ...

  7. 从分支git clone

    git clone -b <branch> <remote_repo> 具体用法:git clone -b 分支名 https://www.xx.com/app.git 以上就 ...

  8. JS中,跨域调用(本地)另一个项目的方法

    IP地址,因为是本地的项目,所以我一开始写的是127.0.0.1...,但不对.应该写本机的IP地址才对!

  9. 1016 部分A+B (15 分)

    正整数 A 的“D​A​​(为 1 位整数)部分”定义为由 A 中所有 D​A​​ 组成的新整数 P​A​​.例如:给定 8,D​A​​=6,则 A 的“6 部分”P​A​​ 是 66,因为 A 中有 ...

  10. 2020.2.19 restful的学习

    restful Api 设计要素 3-8 如何设计Restful Api 资源路径(url),HTTP动词,过滤信息(做分页),状态码,错误处理,返回结果    3-9    初始化运行参数 3-10 ...