ZZDianXin_UI - 郑州电信 演示

treeview-demo.min.js 3.5KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151152153154155
  1. $(function() {
  2. var e = [{
  3. text: "父节点 1",
  4. href: "#parent1",
  5. tags: ["4"],
  6. nodes: [{
  7. text: "子节点 1",
  8. href: "#child1",
  9. tags: ["2"],
  10. nodes: [{
  11. text: "孙子节点 1",
  12. href: "#grandchild1",
  13. tags: ["0"]
  14. }, {
  15. text: "孙子节点 2",
  16. href: "#grandchild2",
  17. tags: ["0"]
  18. }]
  19. }, {
  20. text: "子节点 2",
  21. href: "#child2",
  22. tags: ["0"]
  23. }]
  24. }, {
  25. text: "父节点 2",
  26. href: "#parent2",
  27. tags: ["0"]
  28. }, {
  29. text: "父节点 3",
  30. href: "#parent3",
  31. tags: ["0"]
  32. }, {
  33. text: "父节点 4",
  34. href: "#parent4",
  35. tags: ["0"]
  36. }, {
  37. text: "父节点 5",
  38. href: "#parent5",
  39. tags: ["0"]
  40. }],
  41. o = [{
  42. text: "父节点 1",
  43. tags: ["2"],
  44. nodes: [{
  45. text: "子节点 1",
  46. tags: ["3"],
  47. nodes: [{
  48. text: "孙子节点 1",
  49. tags: ["6"]
  50. }, {
  51. text: "孙子节点 2",
  52. tags: ["3"]
  53. }]
  54. }, {
  55. text: "子节点 2",
  56. tags: ["3"]
  57. }]
  58. }, {
  59. text: "父节点 2",
  60. tags: ["7"]
  61. }, {
  62. text: "父节点 3",
  63. icon: "glyphicon glyphicon-earphone",
  64. href: "#demo",
  65. tags: ["11"]
  66. }, {
  67. text: "父节点 4",
  68. icon: "glyphicon glyphicon-cloud-download",
  69. href: "/demo.html",
  70. tags: ["19"],
  71. selected: !0,
  72. }, {
  73. text: "父节点 5",
  74. icon: "glyphicon glyphicon-certificate",
  75. color: "pink",
  76. backColor: "red",
  77. href: "http://www.tesco.com",
  78. tags: ["available", "0"]
  79. }],
  80. t = '[{"text": "父节点 1","nodes": [{"text": "子节点 1","nodes": [{"text": "孙子节点 1"},{"text": "孙子节点 2"}]},{"text": "子节点 2"}]},{"text": "父节点 2"},{"text": "父节点 3"},{"text": "父节点 4"},{"text": "父节点 5"}]';
  81. $("#treeview1").treeview({
  82. data: e,
  83. onNodeSelected: function(e, o) {
  84. alert("62+");
  85. }
  86. }), $("#treeview2").treeview({
  87. levels: 1,
  88. data: e
  89. }), $("#treeview3").treeview({
  90. levels: 99,
  91. data: e
  92. }), $("#treeview4").treeview({
  93. color: "#428bca",
  94. data: e
  95. }), $("#treeview5").treeview({
  96. color: "#428bca",
  97. expandIcon: "glyphicon glyphicon-chevron-right",
  98. collapseIcon: "glyphicon glyphicon-chevron-down",
  99. nodeIcon: "glyphicon glyphicon-bookmark",
  100. data: e
  101. }), $("#treeview6").treeview({
  102. color: "#428bca",
  103. expandIcon: "glyphicon glyphicon-stop",
  104. collapseIcon: "glyphicon glyphicon-unchecked",
  105. nodeIcon: "glyphicon glyphicon-user",
  106. showTags: !0,
  107. data: e
  108. }), $("#treeview7").treeview({
  109. color: "#428bca",
  110. showBorder: !1,
  111. data: e
  112. }), $("#treeview8").treeview({
  113. expandIcon: "glyphicon glyphicon-stop",
  114. collapseIcon: "glyphicon glyphicon-unchecked",
  115. nodeIcon: "glyphicon glyphicon-user",
  116. color: "yellow",
  117. backColor: "purple",
  118. onhoverColor: "orange",
  119. borderColor: "red",
  120. showBorder: !1,
  121. showTags: !0,
  122. highlightSelected: !0,
  123. selectedColor: "yellow",
  124. selectedBackColor: "darkorange",
  125. data: e
  126. }), $("#treeview9").treeview({
  127. expandIcon: "glyphicon glyphicon-stop",
  128. collapseIcon: "glyphicon glyphicon-unchecked",
  129. nodeIcon: "glyphicon glyphicon-user",
  130. color: "yellow",
  131. backColor: "purple",
  132. onhoverColor: "orange",
  133. borderColor: "red",
  134. showBorder: !1,
  135. showTags: !0,
  136. highlightSelected: !0,
  137. selectedColor: "yellow",
  138. selectedBackColor: "darkorange",
  139. data: o
  140. }), $("#treeview10").treeview({
  141. color: "#428bca",
  142. enableLinks: !0,
  143. data: e
  144. }), $("#treeview11").treeview({
  145. color: "#428bca",
  146. data: e,
  147. onNodeSelected: function(e, o) {
  148. $("#event_output").prepend("<p>您单击了 " + o.text + "</p>")
  149. }
  150. }), $("#treeview12").treeview({
  151. data: t
  152. })
  153. });