layui操作列按钮个数和文字颜色的判断实例


Posted in Javascript onSeptember 11, 2019

一、达到的效果如图,通过值去判断是否需要该按钮

layui操作列按钮个数和文字颜色的判断实例

cols: [[ //表头
 {field: 'money', title: '操作',toolbar: '#barDemos'}
 ]]
<script type="text/html" id="barDemos">
 {{# if(d.s_state == 0){ }}
 <span style="color:red">未审核</span>
 {{# }else if(d.s_state == 1){ }}
 <span>审核通过</span>
 {{# }else if(d.s_state == 2){ }}
 <span style="color:red">审核未通过</span>
 {{# } }}
</script>

重点:

//语法类似于if(){}else if(){}else
 {{# if(d.s_state == 0){ }}
 ...
 {{# }else if(d.s_state == 1){ }}
 ...
 {{# }else if(d.s_state == 2){ }}
 ...
 {{# } }}else{ }}
 ...
 {{# } }}

二、列表格内的文字颜色显示,如图:

layui操作列按钮个数和文字颜色的判断实例

cols: [[ //表头
 {field: 'srm_state', title: '状态',templet: '#sexTpl'}
 ]]
<script type="text/html" id="sexTpl">
 {{# if(d.srm_state == 0){ }}
 <span style="color: red;">未审核</span>
 {{# } else if(d.srm_state ==1) { }}
 <span style="color: green;">审核通过</span>
 {{# } else if(d.srm_state ==2) { }}
 <span style="color: #FFD700;">审核未通过</span> {{# } }}
</script>

以上这篇layui操作列按钮个数和文字颜色的判断实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
Jquery Ajax.ashx 高效分页实现代码
Oct 20 Javascript
jQuery1.6 类型判断实现代码
Sep 01 Javascript
JQuery触发radio或checkbox的change事件
Dec 18 Javascript
js文件缓存之版本管理详解
Jul 05 Javascript
跟我学习javascript的call(),apply(),bind()与回调
Nov 16 Javascript
Node.js程序中的本地文件操作用法小结
Mar 06 Javascript
AngularJS 如何在控制台进行错误调试
Jun 07 Javascript
深入理解JavaScript中的块级作用域、私有变量与模块模式
Oct 31 Javascript
微信小程序开发背景图显示功能
Aug 08 Javascript
详解Vue CLI3配置解析之css.extract
Sep 14 Javascript
node.JS的crypto加密模块使用方法详解(MD5,AES,Hmac,Diffie-Hellman加密)
Feb 06 Javascript
html实现随机点名器的示例代码
Apr 02 Javascript
JS模拟浏览器实现全局搜索功能
Sep 11 #Javascript
Vue项目中使用better-scroll实现菜单映射功能方法
Sep 11 #Javascript
使用layui+ajax实现简单的菜单权限管理及排序的方法
Sep 10 #Javascript
修改layui的后台模板的左侧导航栏可以伸缩的方法
Sep 10 #Javascript
layui固定下拉框的显示条数(有滚动条)的方法
Sep 10 #Javascript
使用layui实现的左侧菜单栏以及动态操作tab项方法
Sep 10 #Javascript
浅谈监听单选框radio改变事件(和layui中单选按钮改变事件)
Sep 10 #Javascript
You might like
晶体管来复再生式二管收音机
2021/03/02 无线电
phpmyadmin的#1251问题
2006/11/25 PHP
PHP图片等比缩放类SimpleImage使用方法和使用实例分享
2014/04/10 PHP
百度地图API使用方法详解
2015/08/25 PHP
PHP ADODB实现分页功能简单示例
2018/05/25 PHP
PHP读取文件或采集时解决中文乱码
2021/03/09 PHP
javascript实现unicode和字符的互相转换
2007/07/18 Javascript
JS 实现完美include载入实现代码
2010/08/05 Javascript
Javascript 静态页面实现随机显示广告的办法
2010/11/17 Javascript
JavaScript判断前缀、后缀是否是空格的方法
2015/04/15 Javascript
JavaScript多图片上传案例
2015/09/28 Javascript
详解vue事件对象、冒泡、阻止默认行为
2017/03/20 Javascript
ES6正则的扩展实例详解
2017/04/25 Javascript
websocket+node.js实现实时聊天系统问题咨询
2017/05/17 Javascript
微信小程序 选项卡的简单实例
2017/05/24 Javascript
详解vue项目构建与实战
2017/06/27 Javascript
用vue构建多页面应用的示例代码
2017/09/20 Javascript
使用cropper.js裁剪头像的实例代码
2017/09/29 Javascript
BootStrap TreeView使用实例详解
2017/11/01 Javascript
在layui下对元素进行事件绑定的实例
2019/09/06 Javascript
JavaScript实现省市联动效果
2019/11/22 Javascript
JS闭包原理及其使用场景解析
2020/12/03 Javascript
基于vue的video播放器的实现示例
2021/02/19 Vue.js
Python使用smtplib模块发送电子邮件的流程详解
2016/06/27 Python
详解python中TCP协议中的粘包问题
2019/03/22 Python
Python求两点之间的直线距离(2种实现方法)
2019/07/07 Python
Django 对象关系映射(ORM)源码详解
2019/08/06 Python
python中time包实例详解
2021/02/02 Python
HTML5新特性之type=file文件上传功能
2018/02/02 HTML / CSS
美国诺德斯特龙百货官网:Nordstrom
2016/08/23 全球购物
西海岸男士和男童服装:Johnnie-O
2018/03/15 全球购物
2014年学校安全工作总结
2014/11/13 职场文书
个人先进事迹材料范文
2014/12/29 职场文书
奔腾年代观后感
2015/06/09 职场文书
请假条应该怎么写?
2019/06/24 职场文书
MySQL优化之如何写出高质量sql语句
2021/05/17 MySQL