Sharepoint2013 webpart 使用Jquery+json数据实现的菜单。

分类： sharepoint2014-11-17 14:17 215人阅读 评论(0) 收藏 举报

把代码块1 复制到txt 里单击后缀名字为js  such as xxx.js.  把此文件上传的文档库。右键--文件完全URL

在Sharepoint2013 里创建 一个webart 内容编辑器--编辑webpart --在content Link--单击浏览 把上面的URL复制进去。

js文件和样式文件需要去网上下载一下。

[javascript] view plaincopy

1. <script src="../lib/jquery.js" type="text/javascript"></script>
2. <script src="../lib/jquery.cookie.js" type="text/javascript"></script>
3. <script src="../jquery.treeview.js" type="text/javascript"></script>
4. <script type="text/javascript">
5. $(document).ready(function(){
6. $("#navigation").treeview({
7. persist: "location",
8. collapsed: true,
9. unique: true
10. });
11. });
12. </script>
13. <ul id="navigation">
14. <li><a href="?1">Item 1</a>
15. <ul>
16. <li><a href="?1.0">Item 1.0</a>
17. <ul>
18. <li><a href="?1.0.0">Item 1.0.0</a></li>
19. </ul>
20. </li>
21. <li><a href="?1.1">Item 1.1</a></li>
22. <li><a href="?1.2">Item 1.2</a>
23. <ul>
24. <li><a href="?1.2.0">Item 1.2.0</a>
25. <ul>
26. <li><a href="?1.2.0.0">Item 1.2.0.0</a></li>
27. <li><a href="?1.2.0.1">Item 1.2.0.1</a></li>
28. <li><a href="?1.2.0.2">Item 1.2.0.2</a></li>
29. </ul>
30. </li>
31. <li><a href="?1.2.1">Item 1.2.1</a>
32. <ul>
33. <li><a href="?1.2.1.0">Item 1.2.1.0</a></li>
34. </ul>
35. </li>
36. <li><a href="?1.2.2">Item 1.2.2</a>
37. <ul>
38. <li><a href="?1.2.2.0">Item 1.2.2.0</a></li>
39. <li><a href="?1.2.2.1">Item 1.2.2.1</a></li>
40. <li><a href="?1.2.2.2">Item 1.2.2.2</a></li>
41. </ul>
42. </li>
43. </ul>
44. </li>
45. </ul>
46. </li>
47. <li><a href="?2">Item 2</a>
48. <ul>
49. <li><span>Item 2.0</span>
50. <ul>
51. <li><a href="?2.0.0">Item 2.0.0</a>
52. <ul>
53. <li><a href="?2.0.0.0">Item 2.0.0.0</a></li>
54. <li><a href="?2.0.0.1">Item 2.0.0.1</a></li>
55. </ul>
56. </li>
57. </ul>
58. </li>
59. <li><a href="?2.1">Item 2.1</a>
60. <ul>
61. <li><a href="?2.1.0">Item 2.1.0</a>
62. <ul>
63. <li><a href="?2.1.0.0">Item 2.1.0.0</a></li>
64. </ul>
65. </li>
66. <li><a href="?2.1.1">Item 2.1.1</a>
67. <ul>
68. <li><a href="?2.1.1.0abc">Item 2.1.1.0</a></li>
69. <li><a href="?2.1.1.1">Item 2.1.1.1</a></li>
70. <li><a href="?2.1.1.2">Item 2.1.1.2</a></li>
71. </ul>
72. </li>
73. <li><a href="?2.1.2">Item 2.1.2</a>
74. <ul>
75. <li><a href="?2.1.2.0">Item 2.1.2.0</a></li>
76. <li><a href="?2.1.2.1">Item 2.1.2.1</a></li>
77. <li><a href="?2.1.2.2">Item 2.1.2.2</a></li>
78. </ul>
79. </li>
80. </ul>
81. </li>
82. </ul>
83. </li>
84. <li><a href="?3">Item 3</a>
85. <ul>
86. <li class="open"><a href="?3.0">Item 3.0</a>
87. <ul>
88. <li><a href="?3.0.0">Item 3.0.0</a></li>
89. <li><a href="?3.0.1">Item 3.0.1</a>
90. <ul>
91. <li><a href="?3.0.1.0">Item 3.0.1.0</a></li>
92. <li><a href="?3.0.1.1">Item 3.0.1.1</a></li>
93. </ul>
94. </li>
95. <li><a href="?3.0.2">Item 3.0.2</a>
96. <ul>
97. <li><a href="?3.0.2.0">Item 3.0.2.0</a></li>
98. <li><a href="?3.0.2.1">Item 3.0.2.1</a></li>
99. <li><a href="?3.0.2.2">Item 3.0.2.2</a></li>
100. </ul>
101. </li>
102. </ul>
103. </li>
104. </ul>
105. </li>
106. </ul>