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 相关文章推荐
Extjs入门之动态加载树代码
Apr 09 Javascript
引用外部js乱码问题分析及解决方案
Apr 12 Javascript
JQuery.Ajax之错误调试帮助信息介绍
Jul 04 Javascript
关于JS中的方法是否加括号的问题
Jul 27 Javascript
一个极为简单的requirejs实现方法
Oct 20 Javascript
Mac下使用charles遇到的问题以及解决办法
Jan 10 Javascript
jQuery点击弹出层弹出模态框点击模态框消失代码分享
Jan 21 Javascript
使用ef6创建oracle数据库的实体模型遇到的问题及解决方案
Nov 09 Javascript
JQuery实现table中tr上移下移的示例(超简单)
Jan 08 jQuery
vue组件数据传递、父子组件数据获取,slot,router路由功能示例
Mar 19 Javascript
Vue源码之关于vm.$delete()/Vue.use()内部原理详解
May 01 Javascript
Vue 如何使用props、emit实现自定义双向绑定的实现
Jun 05 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下通过curl抓取yahoo boss 搜索结果的实现代码
2011/06/10 PHP
php提示undefined index的几种解决方法
2012/05/21 PHP
基于Zend的Captcha机制的应用
2013/05/02 PHP
PHP使用json_encode函数时不转义中文的解决方法
2014/11/12 PHP
PHP+Mysql基于事务处理实现转账功能的方法
2015/07/08 PHP
thinkphp5框架API token身份验证功能示例
2019/05/21 PHP
jQuery DIV弹出效果实现代码
2009/07/03 Javascript
在jQuery 1.5中使用deferred对象的代码(翻译)
2011/03/10 Javascript
nodejs中使用多线程编程的方法实例
2015/03/24 NodeJs
JQuery控制radio选中和不选中方法总结
2015/04/15 Javascript
jquery实现隐藏在左侧的弹性弹出菜单效果
2015/09/18 Javascript
javascript实现表单验证
2016/01/29 Javascript
bootstrap选项卡使用方法解析
2017/01/11 Javascript
vue编译打包本地查看index文件的方法
2018/02/23 Javascript
Angular5中调用第三方库及jQuery的添加的方法
2018/06/07 jQuery
js实现小星星游戏
2020/03/23 Javascript
vue-router路由懒加载及实现的3种方式
2021/02/28 Vue.js
python在linux中输出带颜色的文字的方法
2014/06/19 Python
python 网络爬虫初级实现代码
2016/02/27 Python
python读写配置文件操作示例
2019/07/03 Python
pybind11和numpy进行交互的方法
2019/07/04 Python
关于python导入模块import与常见的模块详解
2019/08/28 Python
Python如何实现的二分查找算法
2020/05/27 Python
python爬取”顶点小说网“《纯阳剑尊》的示例代码
2020/10/16 Python
Python datetime模块的使用示例
2021/02/02 Python
英国领先的男士服装和时尚零售商:Burton
2017/01/09 全球购物
COSETTE官网:奢华,每天
2020/03/22 全球购物
Nayomi官网:沙特阿拉伯王国睡衣和内衣品牌
2020/12/19 全球购物
销售工作人员的自我评价分享
2013/11/10 职场文书
物流专业大学生的自我鉴定
2013/11/13 职场文书
校园网站的创业计划书范文
2013/12/30 职场文书
护理专业学生职业生涯规划范文
2014/03/11 职场文书
水电工程师岗位职责
2015/02/13 职场文书
紧急通知
2015/04/17 职场文书
实用干货:敬酒词大全,帮你应付各种场合
2019/11/21 职场文书
JavaScript+HTML实现学生信息管理系统
2021/04/20 Javascript