layui 将数据以json格式显示标记json与非json内容

最新推荐文章于 2023-12-19 20:03:12 发布

原创

最新推荐文章于 2023-12-19 20:03:12 发布 · 2.2k 阅读

1 ·

CC 4.0 BY-SA版权

本文介绍了一种在前端页面上展示JSON数据的方法，并提供了代码实现。该方法能够根据数据是否为JSON格式进行不同的展示方式，同时也包括了后端的数据处理过程。

1，效果图：

通过一个代码实现两种不同格式内容的展示

json格式内容展示：

在这里插入图片描述
非json格式内容展示：

在这里插入图片描述

2，前端代码：

2.1 父页面前端代码


 function unitdataCheck() {
   
   
    dLong.layeropen(800,600, "核算单元完整性校验", "${ctx}/***/dataJson?mark=unit")
 }

2.2 子编辑页面（CheckJson.jsp）代码


 <script type="text/javascript">

        layui.config({
   
   
            base: '/static/layui-v2.5.6/ext/',// 第三方模块所在目录
            version: 'v1.5.10' // 插件版本号
        }).extend({
   
   
            soulTable: 'soulTable/soulTable',
            tableChild: 'soulTable/tableChild',
            tableMerge: 'soulTable/tableMerge',
            tableFilter: 'soulTable/tableFilter',
            excel: 'soulTable/excel',
            treeGrid:'treegrid/treeGrid',
            xmSelect:'xmSelect/xm-select',
            tableSelect:'tableSelect/tableSelect',
            multiSelect:'multiSelect/multiSelect'

        });
        
        layui.use(['form','table','soulTable','laypage','layer','xmSelect', 'util','laydate','multiSelect','tableSelect'],function(){
   
   
            var form = layui.form;
            var $ = layui.jquery;
            formattdata();
        })
        
        
//格式化解析
//【两种格式代码展示】
       function