1

我是一个新手，我想弄清楚如何在剑道窗口上漂亮地打印 Json，这是我正在使用的功能：

function DisplayRequestSample(eventRequestSample) {
    var kendoWindow = $("<div />").kendoWindow({
        title: "Event Request Sample",
        resizable: false,
        modal: true,
        animation: false,
        width: 700,
        height: 600
    });
    kendoWindow.data("kendoWindow")
        .content(JSON.stringify(JSON.parse(eventRequestSample),null,4))
        .center().open();       
}

电流输出：

{ "TrackingID": "89449f04-86b8-4e48-ad1d-52fde970261d", "RequestorID": "Web", "EventType": "Blah", "Environment": "TEST", "ProfileID": 0 }

但是我怎样才能放置适当的空格和换行符/缩进。

JSON.stringify 没有缩进 Json，不确定我是否正确使用它。感谢您对此进行调查。

4

1 回答 1

1

问题是你在 aDIV和DIVs 中打印 JSON 删除空格、制表符、换行符......所以你应该把它作为 a 放在一个元素中PRE，比如：

kendoWindow.data("kendoWindow")
    .content("<pre>" +
             JSON.stringify(JSON.parse(eventRequestSample),null,4)
             "</pre>")
    .center().open();

第二种选择是使用 CSS 为您的DIV. 您应该使用style='white-space: pre-wrap;'并且您的窗口初始化将类似于：

var kendoWindow = $("<div style='white-space: pre-wrap;  '/>").kendoWindow({

显示第二种方法的代码片段：

function DisplayRequestSample(eventRequestSample) {
  var kendoWindow = $("<div style='white-space: pre-wrap;'/>").kendoWindow({
    title: "Event Request Sample",
    resizable: false,
    modal: true,
    animation: false,
    width: 300,
    height: 200
  });
  kendoWindow.data("kendoWindow")
  .content(JSON.stringify(JSON.parse(eventRequestSample),null,4))
  .center().open(); 
}

DisplayRequestSample('{ "TrackingID": "89449f04-86b8-4e48-ad1d-52fde970261d", "RequestorID": "Web", "EventType": "Blah", "Environment": "TEST", "ProfileID": 0 }');
<link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.common.min.css">
<link rel="stylesheet" href="http://cdn.kendostatic.com/2015.1.318/styles/kendo.default.min.css">

<script src="http://code.jquery.com/jquery-1.9.1.min.js"></script>
<script src="http://cdn.kendostatic.com/2015.1.318/js/kendo.all.min.js"></script>

于 2015-03-20T05:57:10.187 回答