优雅的显示JSON文本

2017-10-30 0phpcom 经典文章

在后台管理中经常需要保存管理员的操作信息，通常我们都试用JSON来保存数据

但是显示是个比较麻烦的问题，通常UTF-8的数据会转换成UNICODE那这个时候后台管理员对这些非人的数据无法看懂，那么就有了几种解决方案

1.如果你的php是5.4版本,直接加上JSON_UNESCAPED_UNICODE参数即可

其他JS 的方法可以参考：

中文的方式解决了那就是显示的问题了

<script type="text/javascript"> function syntaxHighlight(json) { if (typeof json != 'string') { json = JSON.stringify(json, undefined, 2); } json = json.replace(/&/g, '&').replace(/</g, '<').replace(/>/g, '>'); return json.replace(/("(\\u[a-zA-Z0-9]{4}|\\[^u]|[^\\"])*"(\s*:)?|\b(true|false|null)\b|-?\d+(?:\.\d*)?(?:[eE][+\-]?\d+)?)/g, function (match) { var cls = 'number'; if (/^"/.test(match)) { if (/:$/.test(match)) { cls = 'key'; } else { cls = 'string'; } } else if (/true|false/.test(match)) { cls = 'boolean'; } else if (/null/.test(match)) { cls = 'null'; } match = match; if(cls=='string'){ return '<span>' + match + '<br></span>'; }else{ return '<span>' + match + '</span>'; } }); } </script> CSS： <style> pre {outline: 1px solid #ccc; padding: 5px; margin: 5px; } .string { color: green; } .number { color: darkorange; } .boolean { color: blue; } .null { color: magenta; } .key { color: red; } </style>
再来个弹窗

<td><a href="###">查看</a> <pre>{{$item.post}}</pre> </td> 看下效果：