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 ...
随机推荐
- 【PAT甲级】1054 The Dominant Color (20 分)
题意: 输入两个正整数M和N(M<=800,N<=600),分别代表一张图片的宽度和高度,接着输入N行每行包括M个点的颜色编号,输出这张图片主导色的编号.(一张图片的主导色占据了一半以上的 ...
- iOS APP语言国际化之应用内切换语言环境
最近接了一个项目,需求是要做一款应用的英文版本,客户并不清楚,以为要另做一个APP.沟通后告诉他们在之前应用基础上加个国际化功能就好,把之前的语言国际化重新梳理记录一下. 一般设置更改本地语言环境后, ...
- 题解【[Ynoi2012]NOIP2015洋溢着希望】
\[ \texttt{Preface} \] 第二道 Ynoi 的题,纪念一下. 这可能是我唯一可以自己做的 Ynoi 题了. \[ \texttt{Description} \] 维护一个长度为 \ ...
- 解决github访问慢和下载项目慢的问题
一.国内访问 GitHub 为什么很慢? GitHub的CDN域名遭到DNS污染,导致无法连接使用 GitHub 的加速分发服务器,才使得国内访问速度很慢. 二.如何解决 DNS 污染? 通过修改 ...
- unity优化-内存(网上整理)
内存优化内存的开销无外乎以下三大部分:1.资源内存占用:2.引擎模块自身内存占用:3.托管堆内存占用.在一个较为复杂的大中型项目中,资源的内存占用往往占据了总体内存的70%以上.因此,资源使用是否恰当 ...
- 「快学Docker」Docker简介、安装和Hello World实现
前言 Docker已经成为了一门炙手可热的技术,每个程序员(特别是后端程序员)都应该学习下Docker这门技术. Docker是什么 来自官网的定义:Docker是以Docker容器为资源分割和调度的 ...
- Unable to instantiate Action, xxxAction, defined for 'xxx' in namespace '/'xxxAction解决方案
出现这个问题的原因主要有两个 1.如果项目没有使用Spring,则struts.xml配置文件中,这个action的class属性的路径没有写完整,应该是包名.类名 2.如果项目使用了Spring,那 ...
- day1-3js代码执行特性
Js代码执行特性 js中变量声明都会提升到脚本的第一行(注意不是定义,只是声明) 函数变量声明也会提升到前面(是整个函数!)(变量最前,函数其后) 注:在执行js代码前,先把所有变量声明,函数提升至前 ...
- 学习笔记(3)- BioASQ
本次目的是验证BioBERT在QA的效果. A challenge on large-scale biomedical semantic indexing and question answering ...
- Linux centosVMware mysql用户管理、常用sql语句、mysql数据库备份恢复
一.mysql用户管理 grant all on *.* to 'user1'@‘127.0.0.1’ identified by 'mimA123'; 创建user1用户 使用user1登录 /us ...