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 相关文章推荐
JavaScript 入门·JavaScript 具有全范围的运算符
Oct 01 Javascript
菜鸟javascript基础资料整理2
Dec 06 Javascript
Javascript 鼠标移动上去 滑块跟随效果代码分享
Nov 23 Javascript
优化Node.js Web应用运行速度的10个技巧
Sep 03 Javascript
Javascript检查图片大小不要让大图片撑破页面
Nov 04 Javascript
Jquery中CSS选择器用法分析
Feb 10 Javascript
angularjs实现时间轴效果的示例代码
Nov 29 Javascript
在vue项目中,使用axios跨域处理
Mar 07 Javascript
基于Vue实现拖拽功能
Jul 29 Javascript
关于Layui Table隐藏列问题
Sep 16 Javascript
javascript实现一款好看的秒表计时器
Sep 05 Javascript
详解CocosCreator项目结构机制
Apr 14 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
用PHP+java实现自动新闻滚动窗口
2006/10/09 PHP
很实用的一个完整email发送程序
2006/10/09 PHP
PHP下利用shell后台运行PHP脚本,并获取该脚本的Process ID的代码
2011/09/19 PHP
简单实现php上传文件功能
2017/09/21 PHP
PHP获取当前时间不准确问题解决方案
2020/08/14 PHP
PHP大文件分割分片上传实现代码
2020/12/09 PHP
IE6中使用position导致页面变形的解决方案(js代码)
2011/01/09 Javascript
javascript如何写热点图
2015/12/08 Javascript
Express实现前端后端通信上传图片之存储数据库(mysql)傻瓜式教程(二)
2015/12/10 Javascript
JS中改变this指向的方法(call和apply、bind)
2016/03/26 Javascript
JavaScript正则表达式和级联效果
2017/09/14 Javascript
vue中路由参数传递可能会遇到的坑
2017/12/07 Javascript
vue项目每30秒刷新1次接口的实现方法
2018/12/04 Javascript
微信小程序五子棋游戏的悔棋实现方法【附demo源码下载】
2019/02/20 Javascript
原生js代码能实现call和bind吗
2019/07/31 Javascript
layer 刷新某个页面的实现方法
2019/09/05 Javascript
JavaScript setInterval()与setTimeout()计时器
2019/12/27 Javascript
[15:39]教你分分钟做大人:龙骑士
2014/10/30 DOTA
[46:37]LGD vs TNC 2019国际邀请赛小组赛 BO2 第二场 8.15
2019/08/16 DOTA
使用python绘制常用的图表
2016/08/27 Python
python利用有道翻译实现&quot;语言翻译器&quot;的功能实例
2017/11/14 Python
python DataFrame 修改列的顺序实例
2018/04/10 Python
python自动重试第三方包retrying模块的方法
2018/04/24 Python
Python中正则表达式的用法总结
2019/02/22 Python
python 缺失值处理的方法(Imputation)
2019/07/02 Python
Python 中如何实现参数化测试的方法示例
2019/12/10 Python
pytorch点乘与叉乘示例讲解
2019/12/27 Python
浅析python 动态库m.so.1.0错误问题
2020/05/09 Python
Python3爬虫中Splash的知识总结
2020/07/10 Python
一款纯css3实现的动画加载导航
2014/10/08 HTML / CSS
西雅图的买手店:Totokaelo
2019/10/19 全球购物
计算机专业个人求职信范例
2013/09/23 职场文书
经销商培训邀请函
2014/01/21 职场文书
119消防日活动总结
2014/08/29 职场文书
大学生第一学年自我鉴定2015
2014/09/28 职场文书
2015年建党94周年演讲稿
2015/03/19 职场文书