//点击选择方法

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. 虚拟机设置固定IP从而使同一局域网可以访问

    没有ifcfg-eth0 时:https://www.cnblogs.com/itboxue/p/11186910.html (1)关机,将网络模式设置成桥接模式 (2)开机 进入 cd /etc/s ...

  2. 从蜘蛛侠到仙剑,为何知名IP都要开发VR游戏?

    去年3月底斯皮尔伯格指导的<头号玩家>上映,为全球玩家和影迷塑造出一个庞大.刺激而又真实无比的虚拟游戏世界--"绿洲".电影上映后,在人们感叹斯皮尔伯格旺盛的艺术想象力 ...

  3. HDU 1372 Knight Moves(bfs)

    嗯... 题目链接:http://acm.hdu.edu.cn/showproblem.php?pid=1372 这是一道很典型的bfs,跟马走日字一个道理,然后用dir数组确定骑士可以走的几个方向, ...

  4. mcast_join函数

    #include <errno.h> #include <string.h> #include <net/if.h> #include <netinet/in ...

  5. node js 判断数组中是否包含某个值

    判断数组中是否包含某个值这里有四种方法.用的测试数据: let arr=["a","b","c"]; let arr2={"a&q ...

  6. 前端学习 之 JavaScript基础

    一. JavaScript简介 1. JavaScript的历史背景介绍 1994年,网景公司(Netscape)发布了Navigator浏览器0.9版.这是历史上第一个比较成熟的网络浏览器,轰动一时 ...

  7. JAVA笔记---方法

    JAVA的方法 方法的基础 1. return 语句的一些高级应用 public class Method{ public static void main(Sting[] args){ System ...

  8. POJ 2104 主席树模板题

    #include <iostream> #include <cstdio> #include <algorithm> int const maxn = 200010 ...

  9. 并发编程之Event事件

    Event事件 用来同步线程之间的状态. 举个例子: ​ 你把一个任务丢到了子线程中,这个任务将异步执行.如何获取到这个任务的执行状态 解决方法: 如果是拿到执行结果 我们可以采用异步回调, 在这里我 ...

  10. 服务器settings

    1,如果增加了一个新的APP, 那么需要在服务器上 vim settings文件进行修改, 修改方法 i, :wq 2,正式服务器需要一样的操作