Question

我使用textarea以字符串格式显示json，因为我使用了这个

JSON.stringify(this, null, '\t')

为解决textarea定位中的一些问题，我决定使用contenteditable div。如何在contenteditable div中显示json

BusinessUnit : {
    "title": "Business Unit",
    "type": "Text",
    "options": "",
    "required": true,
    "defaultValue": "1",
    "tooltip": "This is a Business-unit",
    "unique": true
}

而不是将其显示为字符串

BusinessUnit : { "title": "Business Unit", "type": "Text", "options": "", "required": true, "defaultValue": "1", "tooltip": "This is a Business-unit", "unique": true }

Answer 1

如果你有一个名为Business_Unit的字符串Json，你可以像下面那样解析它

                Obj_BusinessUnit= jQuery.parseJSON(BusinessUnit);
            var Unique=Obj_BusinessUnit.unique
            var Title=Obj_BusinessUnit.title

对于其余的属性，

等等，这是在JAvascript中在C＃你必须使用

                JavaScriptSerializer Js = new JavaScriptSerializer();
            Channel_info=Js.Deserialize<class>(Json string of the class);
            Js.Serialize( an object oa a class to Json String)

Answer 2

喜欢这个吗？

json = {
    "title": "Business Unit",
    "type": "Text",
    "options": "",
    "required": true,
    "defaultValue": "1",
    "tooltip": "This is a Business-unit",
    "unique": true
}
for(var key in json){
    $('div').append(key + " : " + json[key] + "<br/>"); 
}

DEMO

或者你可以这样做

var p = JSON.stringify(json);
$('div').append(p.replace(/,/g,',<br/>').replace(/{/g,"{<br/>").replace(/}/g,"<br/>}"));

DEMO

Answer 3

最简单的方法是使用可疑的<pre>元素而不是<div>，或者将white-space: pre添加到<div>的CSS。

演示：http://jsfiddle.net/3DKLW/

Answer 4

此行为是内置于标准JSON库的。你需要做的就是：

formatJSON: function(jString) {
    return JSON.stringify(JSON.parse(jString), null, 2);
}

它不会打开root属性 - 也就是说，你的例子会像这样显示（注意领先的大括号和BusinessUnit周围的引号）：

{ 
    "BusinessUnit" : {
        "title": "Business Unit",
        "type": "Text",
        "options": "",
        "required": true,
        "defaultValue": "1",
        "tooltip": "This is a Business-unit",
        "unique": true
    }
}

有关详细信息，请参阅https://developer.mozilla.org/en-US/docs/Web/JavaScript/Reference/Global_Objects/JSON/stringify。

在contenteditable div中显示字符串化的json

4 个答案: