layui table复选框禁止某几条勾选的实例


Posted in Javascript onSeptember 20, 2019

Layui table复选框禁止勾选

var list = [0,1,3];//获得禁用的tr的行index
//遍历设置复选框禁用
for(var i=0;i<list.length;i++){
 $(".layui-table tr[data-index="+list[i]+"] input[type='checkbox']").prop('disabled',true);
 $(".layui-table tr[data-index="+list[i]+"] input[type='checkbox']").next().addClass('layui-btn-disabled');
}

//在tbody内容的第一行tr中写入

<td>{{id}}-{{ischeck}}</td>

//js中获取tr中写入的内容

var table = layui.table;
var checkStatus = table.checkStatus('table');//lay-filter="table"
var values = new Array();
for(var i=0;i<checkStatus.data.length;i++){
 var thisdata = checkStatus.data[i].id;//获取上面那个td的内容
 var check = thisdata.split("-")[1];//截取ischeck
 if(check=='1'){ //拦截禁用的行的id
  values.push(thisdata.split("-")[0]);//截取id
 }
}

var idlist = values//得到所有的id 0,1,3

//给禁用的复选框更改样式

.layui-table-view .layui-form-checkbox.layui-btn-disabled[lay-skin=primary] i,.layui-table-view .layui-form-checkbox.layui-checkbox-disbaled[lay-skin=primary] i{background-color: #e9e9e9;border-color: #e9e9e9;}

以上这篇layui table复选框禁止某几条勾选的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
jquery 插件 任意位置浮动固定层
Dec 25 Javascript
jquery 回车事件实现代码
Aug 23 Javascript
JavaScript 学习笔记之变量及其作用域
Jan 14 Javascript
jquery转盘抽奖功能实现
Nov 13 Javascript
jquery验证邮箱格式是否正确实例讲解
Nov 16 Javascript
js生成随机数的过程解析
Nov 24 Javascript
浅谈JavaScript对象与继承
Jul 10 Javascript
canvas实现手机端用来上传用户头像的代码
Oct 20 Javascript
JS实现隔行换色的表格排序
Mar 27 Javascript
JS/jQuery实现超简单的Table表格添加,删除行功能示例
Jul 31 jQuery
VUEX-action可以修改state吗
Nov 19 Javascript
解决ant design vue 表格a-table二次封装,slots渲染的问题
Oct 28 Javascript
教你如何用Node实现API的转发(某音乐)
Sep 20 #Javascript
使用layui实现树形结构的方法
Sep 20 #Javascript
生成无限制的微信小程序码的示例代码
Sep 20 #Javascript
浅谈layui分页控件field参数接收对象的问题
Sep 20 #Javascript
vuex根据不同的用户权限展示不同的路由列表功能
Sep 20 #Javascript
微信小程序如何播放腾讯视频的实现
Sep 20 #Javascript
Vue+iview+webpack ie浏览器兼容简单处理
Sep 20 #Javascript
You might like
PHP 数组实例说明
2008/08/18 PHP
php htmlentities和htmlspecialchars 的区别
2008/08/18 PHP
实例介绍PHP中zip_open()函数用法
2019/02/15 PHP
PHP使用Session实现上传进度功能详解
2019/08/06 PHP
删除select中所有option选项jquery代码
2013/08/12 Javascript
JS小游戏之极速快跑源码详解
2014/09/25 Javascript
jquery获取当前元素索引值用法实例
2015/06/10 Javascript
javascript常见数据验证插件大全
2015/08/03 Javascript
Angular.js中用ng-repeat-start实现自定义显示
2016/10/18 Javascript
bootstrap fileinput完整实例分享
2016/11/08 Javascript
jquery获取easyui日期控件的值实现方法
2016/11/09 Javascript
JS实现仿百度文库评分功能
2017/01/12 Javascript
layer弹出层框架alert与msg详解
2017/03/14 Javascript
基于daterangepicker日历插件使用参数注意的问题
2017/08/10 Javascript
详解基于Vue/React项目的移动端适配方案
2019/08/23 Javascript
layui问题之自动滚动二级iframe页面到指定位置的方法
2019/09/18 Javascript
vue实现倒计时获取验证码效果
2020/04/17 Javascript
vue 实现单选框设置默认选中值
2019/11/07 Javascript
vue项目配置使用flow类型检查的步骤
2020/03/18 Javascript
vue 项目@change多个参数传值多个事件的操作
2021/01/29 Vue.js
Python open读写文件实现脚本
2008/09/06 Python
Python编程把二叉树打印成多行代码
2018/01/04 Python
手把手教你如何安装Pycharm(详细图文教程)
2018/11/28 Python
PyCharm的设置方法和第一个Python程序的建立
2019/01/16 Python
CSS3简单实现照片墙
2014/12/12 HTML / CSS
尤妮佳moony海外旗舰店:日本殿堂级纸尿裤品牌
2018/02/23 全球购物
教师评语大全
2014/04/28 职场文书
2014酒店客房部工作总结
2014/12/16 职场文书
绿色环保倡议书
2015/04/28 职场文书
指导老师鉴定意见
2015/06/05 职场文书
趣味运动会加油词
2015/07/18 职场文书
土木工程生产实习心得体会
2016/01/22 职场文书
初中英语教学反思范文
2016/02/15 职场文书
vue基于Teleport实现Modal组件
2021/05/31 Vue.js
javascript拖曳互换div的位置实现示例
2021/06/28 Javascript
数据库之SQL技巧整理案例
2021/07/07 SQL Server