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 出生日期和身份证判断大全
Nov 13 Javascript
点击下载链接 弹出页面实现代码
Oct 01 Javascript
js获取单元格自定义属性值的代码(IE/Firefox)
Apr 05 Javascript
jquery下异步提交表单 异步跨域提交表单
Nov 17 Javascript
基于jQuery选择器的整理集合
Apr 26 Javascript
jQuery .attr()和.removeAttr()方法操作元素属性示例
Jul 16 Javascript
解决前端跨域问题方案汇总
Nov 20 Javascript
概述javascript在Google IE中的调试技巧
Nov 24 Javascript
Angularjs 动态添加指令并绑定事件的方法
Apr 13 Javascript
详解Vuex管理登录状态
Nov 13 Javascript
如何用vue-cli3脚手架搭建一个基于ts的基础脚手架的方法
Dec 12 Javascript
JavaScript实现五子棋小游戏
Oct 26 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
收集的DedeCMS一些使用经验
2007/03/17 PHP
CURL状态码列表(详细)
2013/06/27 PHP
js限制checkbox勾选的个数以及php获取多个checkbbox的方法深入解析
2013/07/18 PHP
PHP模拟asp.net的StringBuilder类实现方法
2015/08/08 PHP
提高php编程效率技巧
2015/08/13 PHP
php判断手机浏览还是web浏览,并执行相应的动作简单实例
2016/07/28 PHP
Zend Framework动作控制器用法示例
2016/12/09 PHP
javascript中对对层的控制
2006/12/29 Javascript
基于jQuery实现表格数据的动态添加与统计的代码
2011/01/31 Javascript
Jquery Ajax的Get方式时需要注意URL地方
2011/04/07 Javascript
javascript学习笔记(九)javascript中的原型(prototype)及原型链的继承方式
2011/04/12 Javascript
Javascript 判断是否存在函数的方法
2013/01/03 Javascript
关于div自适应高度/左右高度自适应一致的js代码
2013/03/22 Javascript
在jQuery中 关于json空对象筛选替换
2013/04/15 Javascript
jquery showModelDialog的使用方法示例详解
2013/11/19 Javascript
jQuery的one()方法用法实例
2015/01/19 Javascript
使用伪命名空间封装保护独自创建的对象方法
2016/08/04 Javascript
jQuery选择器中的特殊符号处理方法
2017/09/08 jQuery
JS实现生成由字母与数字组合的随机字符串功能详解
2018/05/25 Javascript
vuex提交state&amp;&amp;实时监听state数据的改变方法
2018/09/16 Javascript
vue element table 表格请求后台排序的方法
2018/09/28 Javascript
Python统计日志中每个IP出现次数的方法
2015/07/06 Python
Django中更新多个对象数据与删除对象的方法
2015/07/17 Python
对pandas的dataframe绘图并保存的实现方法
2017/08/05 Python
深度学习入门之Pytorch 数据增强的实现
2020/02/26 Python
python实现QQ邮箱发送邮件
2020/03/06 Python
PyInstaller将Python文件打包为exe后如何反编译(破解源码)以及防止反编译
2020/04/15 Python
scrapy-redis分布式爬虫的搭建过程(理论篇)
2020/09/29 Python
美国领先的家庭健康检测试剂盒提供商:LetsGetChecked
2019/03/18 全球购物
2014年国庆标语
2014/06/30 职场文书
大学生个人学年总结
2015/02/15 职场文书
挂职锻炼个人总结
2015/03/05 职场文书
个人自荐书怎么写
2015/03/26 职场文书
学校后勤工作总结2015
2015/05/15 职场文书
Python办公自动化之教你用Python批量识别发票并录入到Excel表格中
2021/06/26 Python
Typescript类型系统FLOW静态检查基本规范
2022/05/25 Javascript