layui 对table中的数据进行转义的实例


Posted in Javascript onSeptember 12, 2019

方法一 通过done回调进行遍历:

//方法级渲染
    table.render({
      id: 'demoList',
      elem: '#demoList'
      , url: 'showDemoList'
      , cols: [[
        {checkbox: true, fixed: true, width: '10%'}
        , {field: 'id', title: '编号', width: '15%', sort: true}
        , {field: 'pipe_id', title: '机构ID', width: '15%'}
        , {field: 'bank_id', title: '银行ID', width: '10%'}
        , {field: 'pipe_cost', title: '成本', width: '10%'}
        , {field: 'status', title: '状态', width: '20%'}
        , {field: 'remark', title: '操作', width: '20%', toolbar: '#toolBar'}
      ]],
      done: function (res, curr, count) {
        //如果是异步请求数据方式,res即为你接口返回的信息。
        //如果是直接赋值的方式,res即为:{data: [], count: 99} data为当前页数据、count为数据总长度
        $("[data-field='status']").children().each(function () {
          if ($(this).text() == '0') {
            $(this).text('有效');
          } else if ($(this).text() == '1') {
            $(this).text('无效');
          }
        });
      }
      , page: true
      , height: 'full-83'
    });

方法二 通过layui的templet模板实现:

, {field: 'status', title: '状态', width: '20%',templet:'#status'}
 
<script type="text/html" id="status">
  {{# if(d.status=='0'){ }}
  有效
  {{# }else{ }}
    无效
  {{# } }}
</script>

以上这篇layui 对table中的数据进行转义的实例就是小编分享给大家的全部内容了,希望能给大家一个参考,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
在JavaScript中重写jQuery对象的方法实例教程
Aug 25 Javascript
js+csss实现的一个带复选框的下拉框
Sep 29 Javascript
js使用onmousemove和onmouseout获取鼠标坐标的方法
Mar 31 Javascript
JQuery中ajax方法访问web服务实例
Jul 18 Javascript
Angularjs实现搜索关键字高亮显示效果
Jan 17 Javascript
Easyui ueditor 整合解决不能编辑的问题(推荐)
Jun 25 Javascript
Vue 页面切换效果之 BubbleTransition(推荐)
Apr 08 Javascript
Koa2微信公众号开发之本地开发调试环境搭建
May 16 Javascript
微信小程序实现自定义picker选择器弹窗内容
May 26 Javascript
vue基础之事件v-onclick=&quot;函数&quot;用法示例
Mar 11 Javascript
vue 引用自定义ttf、otf、在线字体的方法
May 09 Javascript
Layui table field初始化加载时进行隐藏的方法
Sep 19 Javascript
layui点击数据表格添加或删除一行的例子
Sep 12 #Javascript
小程序如何支持使用 async/await详解
Sep 12 #Javascript
layui清空,重置表单数据的实例
Sep 12 #Javascript
layui table 多行删除(id获取)的方法
Sep 12 #Javascript
详解Vue中CSS样式穿透问题
Sep 12 #Javascript
微信小程序 函数防抖 解决重复点击消耗性能问题实现代码
Sep 12 #Javascript
微信小程序之 catalog 切换实现解析
Sep 12 #Javascript
You might like
PHP学习之PHP变量
2006/10/09 PHP
IIS php环境配置PHP5 MySQL5 ZendOptimizer phpmyadmin安装与配置
2008/11/18 PHP
php二分查找二种实现示例
2014/03/12 PHP
php cookie中点号(句号)自动转为下划线问题
2014/10/21 PHP
php删除文本文件中重复行的方法
2015/04/28 PHP
PHP实现通过文本文件统计页面访问量功能示例
2019/02/13 PHP
PHP copy函数使用案例代码解析
2020/09/01 PHP
javascript arguments 传递给函数的隐含参数
2009/08/21 Javascript
JavaScript获取FCK编辑器信息的具体方法
2013/07/12 Javascript
基于jQuery实现文本框只能输入数字(小数、整数)
2016/01/14 Javascript
node.js实现端口转发
2016/04/14 Javascript
深入理解ES6学习笔记之块级作用域绑定
2017/08/19 Javascript
angularjs实现简单的购物车功能
2017/09/21 Javascript
JS脚本实现网页自动秒杀点击
2018/01/11 Javascript
js实现二级菜单点击显示当前内容效果
2018/04/28 Javascript
vue安装和使用scss及sass与scss的区别详解
2018/10/15 Javascript
vue动态注册组件实例代码详解
2019/05/30 Javascript
vue使用codemirror的两种用法
2019/08/27 Javascript
[44:21]Ti4 循环赛第四日 附加赛NEWBEE vs LGD
2014/07/13 DOTA
Keras - GPU ID 和显存占用设定步骤
2020/06/22 Python
解决redis与Python交互取出来的是bytes类型的问题
2020/07/16 Python
python os.listdir()乱码解决方案
2021/01/31 Python
HTML5+CSS3应用详解
2014/02/24 HTML / CSS
基本款天堂:Everlane
2017/05/13 全球购物
SheIn沙特阿拉伯:女装在线
2020/03/23 全球购物
C/C++程序员常见面试题一
2012/12/08 面试题
经典公益广告词
2014/03/13 职场文书
合作意向书范本
2014/03/31 职场文书
幼儿园亲子活动总结
2014/04/26 职场文书
节能环保演讲稿
2014/08/28 职场文书
2015年元旦文艺晚会总结(学院)
2014/11/28 职场文书
Go语言 go程释放操作(退出/销毁)
2021/04/30 Golang
解决pytorch 损失函数中输入输出不匹配的问题
2021/06/05 Python
Python内置数据结构列表与元组示例详解
2021/08/04 Python
关于CentOS 8 搭建MongoDB4.4分片集群的问题
2021/10/24 MongoDB
日元符号 ¥
2022/02/17 杂记