others.html 3.9 KB

12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152535455565758596061626364656667686970717273747576777879808182838485868788899091929394959697
  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4. <meta charset="utf-8">
  5. <title>后台管理系统</title>
  6. <link rel="stylesheet" href="js/jquery-easyui-1.5.4.2/themes/default/easyui.css">
  7. <link rel="stylesheet" href="js/jquery-easyui-1.5.4.2/themes/icon.css">
  8. <link rel="stylesheet" href="js/webuploader-0.1.5/webuploader.css">
  9. <script src="js/jquery-1.12.4.js"></script>
  10. <script src="js/jquery-easyui-1.5.4.2/jquery.easyui.min.js"></script>
  11. <script src="js/jquery-easyui-1.5.4.2/locale/easyui-lang-zh_CN.js"></script>
  12. <script src="js/webuploader-0.1.5/webuploader.html5only.min.js"></script>
  13. <script src="js/ueditor1.4.3.3/ueditor.config.js"></script>
  14. <script src="js/ueditor1.4.3.3/ueditor.all.min.js"></script>
  15. <script src="js/config.js"></script>
  16. <link rel="stylesheet" href="css/menu.css">
  17. <!--<script src="other.js"></script>-->
  18. </head>
  19. <body>
  20. <div class="easyui-panel" style="width: 198px;height: 750px;position:absolute;">
  21. <ul class="menu_list">
  22. <li>
  23. <p class="menu_head">运动员管理</p>
  24. <div class="menu_body">
  25. <a href="#" class=""onclick="addTab('运动员成绩表格','运动员成绩表格.html')">运动员成绩表格</a>
  26. <!-- <a href="#" class=""onclick="addTab('运动员成绩录入表','运动员成绩录入表.html')">运动员成绩录入表</a> -->
  27. </div>
  28. </li>
  29. <li>
  30. <p class="menu_head">体育赛事管理</p>
  31. <div class="menu_body">
  32. <a href="#" class=""onclick="addTab('体育赛程表格','体育赛程表格.html')">体育赛程表格</a>
  33. <a href="#" class=""onclick="addTab('体育赛事修改表','体育赛事修改表.html')">体育赛事修改表</a>
  34. </div>
  35. </li>
  36. <li>
  37. <p class="menu_head">成绩管理</p>
  38. <div class="menu_body">
  39. <a href="#" class=""onclick="addTab('单项成绩表格','单项成绩表格.html')">单项成绩表格</a>
  40. <a href="#" class=""onclick="addTab('参赛队成绩修改表','参赛队成绩修改表.html')">参赛队成绩修改表</a>
  41. </div>
  42. </li>
  43. </ul>
  44. </div>
  45. <div id="tt" class="easyui-tabs"
  46. style="width:100%;height:750px;position:absolute;left: 200px">
  47. <div title="首页" style="padding:5px">
  48. <ul class="easyui-tree" data-options="url:'tree_data1.json',method:'get',animate:true"></ul>
  49. <ul style="list-style: none">
  50. <li>欢迎来到运动会后台管理系统!</li>
  51. <li>请从左侧选择一个操作。</li>
  52. </ul>
  53. </div>
  54. </div>
  55. <script>
  56. function addTab(title,url) {
  57. if ($('#tt').tabs('exists', title)){
  58. $('#tt').tabs('select', title);
  59. } else {
  60. var content = '<iframe scrolling="auto" ' +
  61. 'frameborder="0" src="'+url+'" style="width:100%;height:100%;">' +
  62. '</iframe>';
  63. $('#tt').tabs('add',{
  64. title:title,
  65. content:content,
  66. closable:true
  67. });
  68. }
  69. }
  70. </script>
  71. <script>
  72. // 隐藏所有二级菜单
  73. $('.menu_head+div').hide();
  74. // 需求:单击一个p元素,p元素下面的div就显示出来,显示当前,隐藏其他
  75. $('.menu_head').click(function() {
  76. //设置当前菜单右侧图标样式
  77. $(this).css('backgroundImage', 'url(img/pro_down.png)');
  78. // 显示当前菜单对应的子菜单
  79. $(this).next('div').show();
  80. // 获取其他菜单外层的li元素
  81. var parentli = $(this).parent('li');
  82. var lis = parentli.siblings('li');
  83. // 找到每个li元素下的主菜单,设置主菜单右侧图标样式
  84. lis.children('p').css('backgroundImage','url(img/pro_left.png)')
  85. // 隐藏其他主菜单下的子菜单
  86. lis.children('div').hide();
  87. });
  88. </script>
  89. </body>
  90. </html>