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 相关文章推荐
JS 无限级 Select效果实现代码(json格式)
Aug 30 Javascript
javascript笔记 String类replace函数的一些事
Sep 22 Javascript
javascript实现div浮动在网页最顶上并带关闭按钮效果实例
Aug 13 Javascript
JS阻止用户多次提交示例代码
Mar 26 Javascript
JavaScript中eval函数的问题
Jan 31 Javascript
Javascript之面向对象--封装
Dec 02 Javascript
jQuery+ajax的资源回收处理机制分析
Jan 07 Javascript
SVG实现时钟效果
Jul 17 Javascript
微信小程序获取用户信息并保存登录状态详解
May 10 Javascript
layer实现弹出层自动调节位置
Sep 05 Javascript
关于vue路由缓存清除在main.js中的设置
Nov 06 Javascript
JS桶排序的简单理解与实现方法示例
Nov 25 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下载文件,添加响应头的简单实例
2016/09/22 PHP
ThinkPHP框架使用redirect实现页面重定向的方法实例分析
2018/04/12 PHP
thinkphp5实现微信扫码支付
2019/12/23 PHP
PHP实现Markdown文章上传到七牛图床的实例内容
2020/02/11 PHP
Javascript学习笔记1 数据类型
2010/01/11 Javascript
JavaScript 通过模式匹配实现重载
2010/08/12 Javascript
js替换字符串的所有示例代码
2013/07/23 Javascript
javascript实现给定半径求出圆的面积
2015/06/26 Javascript
JQUERY表单暂存功能插件分享
2016/02/23 Javascript
基于jquery实现最简单的选项卡切换效果
2016/05/08 Javascript
实例解析jQuery中proxy()函数的用法
2016/05/24 Javascript
jQuery解决input元素的blur事件和其他非表单元素的click事件冲突问题
2016/08/15 Javascript
JS实现的DIV块来回滚动效果示例
2017/02/07 Javascript
使用jquery datatable和bootsrap创建表格实例代码
2017/03/17 Javascript
简单实现js点击展开二级菜单功能
2017/05/16 Javascript
angular实现spa单页面应用实例
2017/07/10 Javascript
Vue实现点击后文字变色切换方法
2018/02/11 Javascript
Vue加载json文件的方法简单示例
2019/01/28 Javascript
JavaScript变量作用域及内存问题实例分析
2019/06/10 Javascript
Vue-Cli项目优化操作的实现
2019/10/27 Javascript
Python跳出循环语句continue与break的区别
2014/08/25 Python
进一步探究Python中的正则表达式
2015/04/28 Python
python中pass语句用法实例分析
2015/04/30 Python
python 函数内部修改外部变量的方法
2018/12/18 Python
PyQt5实现简易电子词典
2019/06/25 Python
matplotlib 范围选区(SpanSelector)的使用
2021/02/24 Python
英国航空官网:British Airways
2016/09/11 全球购物
玩具反斗城西班牙网上商城:ToysRUs西班牙
2017/01/19 全球购物
大学毕业的自我鉴定
2013/10/08 职场文书
农民工工资支付承诺函
2014/03/31 职场文书
营销总经理岗位职责范本
2014/09/02 职场文书
在酒桌上的敬酒词
2015/08/12 职场文书
2016入党积极分子党课学习心得体会
2015/10/09 职场文书
八年级历史教学反思
2016/02/19 职场文书
matlab xlabel位置的设置方式
2021/05/21 Python
Python实现学生管理系统并生成exe可执行文件详解流程
2022/01/22 Python