index.htm 2.5 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
  2. "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  3. <html xmlns="http://www.w3.org/1999/xhtml">
  4. <head>
  5. <title>原生json格式化及高亮</title>
  6. <meta name="description" content="json,格式化,高亮">
  7. <meta name="keywords" content="json,格式化,高亮">
  8. <script src="json/c.js" type="text/javascript"></script>
  9. <link href="json/s.css" type="text/css" rel="stylesheet"></link>
  10. </head>
  11. <body>
  12. <div class="HeadersRow">
  13. <div id="HeaderTitle"> JSON格式化及高亮 &nbsp;&copy;&nbsp;2012&nbsp; &nbsp;<span
  14. style='color:#aaa;font-weight:bold;font-style:italic'>Random_Coder</span></div>
  15. <h3 id="HeaderSubTitle">JSON格式化及高亮:</h3>
  16. <textarea id="RawJson">
  17. </textarea>
  18. </div>
  19. <div id="ControlsRow">
  20. <input type="Button" value="格式化" onclick="Process()"/>
  21. <span id="TabSizeHolder">
  22. 缩进量
  23. <select id="TabSize" onchange="TabSizeChanged()">
  24. <option value="1">1</option>
  25. <option value="2" selected="true">2</option>
  26. <option value="3">3</option>
  27. <option value="4">4</option>
  28. <option value="5">5</option>
  29. <option value="6">6</option>
  30. </select>
  31. </span>
  32. <label for="QuoteKeys">
  33. <input type="checkbox" id="QuoteKeys" onclick="QuoteKeysClicked()" checked="true"/>
  34. 引号
  35. </label>&nbsp;
  36. <a href="javascript:void(0);" onclick="SelectAllClicked()">全选</a>
  37. &nbsp;
  38. <span id="CollapsibleViewHolder">
  39. <label for="CollapsibleView">
  40. <input type="checkbox" id="CollapsibleView" onclick="CollapsibleViewClicked()" checked="true"/>
  41. 显示控制
  42. </label>
  43. </span>
  44. <span id="CollapsibleViewDetail">
  45. <a href="javascript:void(0);" onclick="ExpandAllClicked()">展开</a>
  46. <a href="javascript:void(0);" onclick="CollapseAllClicked()">叠起</a>
  47. <a href="javascript:void(0);" onclick="CollapseLevel(3)">2级</a>
  48. <a href="javascript:void(0);" onclick="CollapseLevel(4)">3级</a>
  49. <a href="javascript:void(0);" onclick="CollapseLevel(5)">4级</a>
  50. <a href="javascript:void(0);" onclick="CollapseLevel(6)">5级</a>
  51. <a href="javascript:void(0);" onclick="CollapseLevel(7)">6级</a>
  52. <a href="javascript:void(0);" onclick="CollapseLevel(8)">7级</a>
  53. <a href="javascript:void(0);" onclick="CollapseLevel(9)">8级</a>
  54. </span>
  55. </div>
  56. <div id="Canvas" class="Canvas"></div>
  57. <script type="text/javascript" src="json/m.js"></script>
  58. </body>
  59. </html>