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调试工具(下载)
Jan 09 Javascript
详解JavaScript中void语句的使用
Jun 04 Javascript
学习JavaScript设计模式之责任链模式
Jan 18 Javascript
jQuery实现横向带缓冲的水平运动效果(附demo源码下载)
Jan 29 Javascript
谈谈Vue.js——vue-resource全攻略
Jan 16 Javascript
详解Vue中使用Echarts的两种方式
Jul 03 Javascript
JS实现数组删除指定元素功能示例
Jun 05 Javascript
vue分页插件的使用方法
Dec 25 Javascript
JS实现图片幻灯片效果代码实例
May 21 Javascript
vue中移动端调取本地的复制的文本方式
Jul 18 Javascript
vue radio单选框,获取当前项(每一项)的value值操作
Sep 10 Javascript
JS addEventListener()和attachEvent()方法实现注册事件
Jan 11 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递归方法实现无限分类实例代码
2014/02/28 PHP
PHP数据库万能引擎类adodb配置使用以及实例集锦
2014/06/12 PHP
jquery CSS选择器笔记
2010/03/29 Javascript
javaScript 利用闭包模拟对象的私有属性
2011/12/29 Javascript
jQuery+PHP+MySQL二级联动下拉菜单实例讲解
2015/10/27 Javascript
自动化测试读写64位操作系统的注册表
2016/08/15 Javascript
巧用Vue.js+Vuex制作专门收藏微信公众号的app
2016/11/03 Javascript
jQuery插件fullPage.js实现全屏滚动效果
2016/12/02 Javascript
JavaScript版经典游戏之扫雷游戏完整示例【附demo源码下载】
2016/12/12 Javascript
JavaScript求一个数组中重复出现次数最多的元素及其下标位置示例
2018/07/23 Javascript
SSM+layUI 根据登录信息显示不同的页面方法
2019/09/20 Javascript
vue 组件之间事件触发($emit)与event Bus($on)的用法说明
2020/07/28 Javascript
解决Vue中使用keepAlive不缓存问题
2020/08/04 Javascript
在vue中给后台接口传的值为数组的格式代码
2020/11/12 Javascript
为什么推荐使用JSX开发Vue3
2020/12/28 Vue.js
vue.js实现点击图标放大离开时缩小的代码
2021/01/27 Vue.js
基于Python os模块常用命令介绍
2017/11/03 Python
Python之web模板应用
2017/12/26 Python
python TCP Socket的粘包和分包的处理详解
2018/02/09 Python
对numpy和pandas中数组的合并和拆分详解
2018/04/11 Python
Django+Ajax+jQuery实现网页动态更新的实例
2018/05/28 Python
详解Python3中setuptools、Pip安装教程
2019/06/18 Python
Django框架 查询Extra功能实现解析
2019/09/04 Python
Python实现自定义读写分离代码实例
2019/11/16 Python
python循环输出三角形图案的例子
2019/11/22 Python
通过Python pyecharts输出保存图片代码实例
2020/11/25 Python
美国折扣宠物药房:Total Pet Supply
2018/05/27 全球购物
护理自荐信范文
2013/10/05 职场文书
校园公益广告语
2014/03/13 职场文书
党的群众路线教育实践活动整改方案
2014/10/28 职场文书
贷款收入证明格式
2015/06/24 职场文书
2016年国庆节67周年活动总结
2016/04/01 职场文书
详解运行Python的神器Jupyter Notebook
2021/06/03 Python
分析JVM源码之Thread.interrupt系统级别线程打断
2021/06/29 Java/Android
PHP RabbitMQ消息列队
2022/05/11 PHP
JS前端轻量fabric.js系列之画布初始化
2022/08/05 Javascript