快捷導(dǎo)航

layui操作列按鈕個數(shù)和文字顏色的判斷實(shí)例

更新時間：2019年09月11日 08:40:43 作者：楊蔥兒

今天小編就為大家分享一篇layui操作列按鈕個數(shù)和文字顏色的判斷實(shí)例，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧

一、達(dá)到的效果如圖，通過值去判斷是否需要該按鈕

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>

重點(diǎn)：

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

二、列表格內(nèi)的文字顏色顯示，如圖：

cols: [[ //表頭
 {field: 'srm_state', title: '狀態(tài)',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操作列按鈕個數(shù)和文字顏色的判斷實(shí)例就是小編分享給大家的全部內(nèi)容了，希望能給大家一個參考，也希望大家多多支持腳本之家。

您可能感興趣的文章:

相關(guān)文章

解決JS外部文件中文注釋出現(xiàn)亂碼問題
中文亂碼在Java Web開發(fā)中經(jīng)常出現(xiàn)，這是由于不同的部分編碼不一樣造成的，一般在開發(fā)中，我們把所有能設(shè)編碼的地方，全部設(shè)置成UTF-8，但是有時候還是會出現(xiàn)亂碼的情況。下面通過本文給大家分享JS外部文件中文注釋出現(xiàn)亂碼的解決方案，一起看看吧
2017-07-07
淺談layui 表單元素的選中問題
今天小編就為大家分享一篇淺談layui 表單元素的選中問題，具有很好的參考價值，希望對大家有所幫助。一起跟隨小編過來看看吧
2019-10-10
JavaScript解決跨域的三種方法小結(jié)
在Web應(yīng)用中,當(dāng)一個網(wǎng)頁的腳本試圖去請求另一個域名下的資源時,就會遇到跨域問題,跨域問題是由瀏覽器的同源策略所引起的,本文給大家介紹了JavaScript解決跨域的三種方法,需要的朋友可以參考下
2024-03-03
編寫高質(zhì)量JavaScript代碼的基本要點(diǎn)
編寫高質(zhì)量JavaScript代碼的基本要點(diǎn)分享給大家，感興趣的小伙伴們可以參考一下
2016-03-03
js模仿java的Map集合詳解
這篇文章主要介紹了js模仿java的Map集合的相關(guān)資料，Java中某些最常用的集合類是List和Map，感興趣的小伙伴們可以了解一下
2016-01-01
微信小程序開發(fā)自定義tabBar實(shí)戰(zhàn)案例(定制消息99+小紅心)
一定的需求情況下無法使用小程序原生的tabbar的時候,需要自行實(shí)現(xiàn)一個和tabbar功能一模一樣的自制組件,下面這篇文章主要給大家介紹了關(guān)于微信小程序開發(fā)自定義tabBar(定制消息99+小紅心)的相關(guān)資料,需要的朋友可以參考下
2022-12-12
詳解用場景去理解函數(shù)柯里化(入門篇)
這篇文章主要介紹了用場景去理解函數(shù)柯里化(入門篇)，文中通過示例代碼介紹的非常詳細(xì)，對大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價值，需要的朋友們下面隨著小編來一起學(xué)習(xí)學(xué)習(xí)吧
2019-04-04
js對象合并的4種方式與數(shù)組合并的4種方式
這篇文章主要介紹了js對象合并的4種方式與數(shù)組合并的4種方式，具有很好的參考價值，希望對大家有所幫助。如有錯誤或未考慮完全的地方，望不吝賜教
2022-10-10
JavaScript中防抖和節(jié)流的實(shí)戰(zhàn)應(yīng)用記錄
防抖與節(jié)流都是用來限制用戶頻發(fā)觸發(fā)事件的機(jī)制,下面這篇文章主要給大家介紹了關(guān)于JavaScript中防抖和節(jié)流的實(shí)戰(zhàn)應(yīng)用,文中通過實(shí)例代碼介紹的非常詳細(xì),需要的朋友可以參考下
2022-04-04
JavaScript實(shí)現(xiàn)更換頭像功能
這篇文章主要為大家詳細(xì)介紹了JavaScript實(shí)現(xiàn)更換頭像功能，文中示例代碼介紹的非常詳細(xì)，具有一定的參考價值，感興趣的小伙伴們可以參考一下
2021-08-08