zoukankan      html  css  js  c++  java
  • JSONView

    <div class="modal fade bs-example-modal-lg" id="jsonModal" tabindex="-1" role="dialog" aria-labelledby="myLargeModalLabel">
          <div class="modal-dialog" role="document" style="">
               
                <div class="modal-content col-md-12" style="1000px !important;margin:50%;transform:translate(-50%,-50%);">
                      <div class="modal-header" style="padding-left:0;padding-right:0;">
                           <button type="button" class="close" data-dismiss="modal" aria-label="Close" style=""><span aria-hidden="true">&times;</span></button>
                           <h4 class="modal-title notice_title" id="myModalLabel" style="font-family:'微软雅黑';font-size:16px;color:#383838;">JSON查看</h4>
                            
                      </div>
                      <div class="modal-body col-md-12" style="padding-left:0;padding-right:0;max-height:800px;overflow-y:scroll;"> 
                            <div style="margin:10px;">
                                  <button id="collapse-btn">收起</button>
                              <button id="expand-btn">展开</button>
                              
                            </div>
                               <div id="jsonContent"></div>
                      </div>
                      
                </div>
             
          </div>
                       
    </div>
    $('#operationTable').on('click', 'span.contentHistory', function (e) {
    
    $('#jsonModal').modal({backdrop: 'static'});
    var datalist=$(this).data('content');
    
    datalist=JSON.parse(datalist);
    
    //    var json = {"hey": "guy","anumber": 243,"anobject": {"whoa": "nuts","anarray": [1,2,"thr<h1>ee"],"anotherarray": [1, 2], "more":"stuff"},"awesome": true,"bogus": false,"meaning": null, "japanese":"明日がある。", "link": "http://jsonview.com", "notLink": "http://jsonview.com is great"};
    $('#jsonContent').JSONView(datalist);
    e.stopPropagation();
    $(this).unbind("click"); //移除click
    return false;
    });
    
    $('#collapse-btn').on('click', function() {
    $('#jsonContent').JSONView('collapse');
    });
    
    $('#expand-btn').on('click', function() {
    $('#jsonContent').JSONView('expand');
    });
    
    $('#toggle-btn').on('click', function() {
    $('#jsonContent').JSONView('toggle');
    });
    
    $('#toggle-level1-btn').on('click', function() {
    $('#jsonContent').JSONView('toggle', 1);
    });
    
    $('#toggle-level2-btn').on('click', function() {
    $('#jsonContent').JSONView('toggle', 2);
    });
  • 相关阅读:
    Vue CLI Plugin Electron Builder 打包出现空白问题
    git 不小心提交大文件出错问题
    electron-vue创建项目
    electron ico文件问题
    多尺寸ico图标制作工具GIMP
    ps ico图标制作插件
    fluent-ffmpeg
    CopyWebpackPlugin 拷贝某个文件夹的文件到某个文件夹
    electron-vue 目录有中文打包报错问题
    js 给控件新增class
  • 原文地址:https://www.cnblogs.com/zjpzjp/p/7575575.html
Copyright © 2011-2022 走看看