zhuyem.jsp 4.6 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145146147148149150151
  1. <%@ page language="java" contentType="text/html; charset=UTF-8"
  2. pageEncoding="UTF-8"%>
  3. <%@ page import="java.util.*" %>
  4. <%@ page import="com.it.bean.*" %>
  5. <%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
  6. <!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
  7. <html>
  8. <head>
  9. <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" />
  10. <title>SimpleTree</title>
  11. <link rel="stylesheet" type="text/css" href="js/tree_themes/SimpleTree.css"/>
  12. <link rel="stylesheet" href="js/tree_themes/style.css" media="screen" type="text/css" />
  13. <script type="text/javascript" src="js/jquery-1.6.min.js"></script>
  14. <script type="text/javascript" src="js/SimpleTree.js"></script>
  15. <script type="text/javascript">
  16. $(function(){
  17. $(".st_tree").SimpleTree({
  18. click:function(a){
  19. if(!$(a).attr("hasChild"))
  20. alert($(a).attr("ref"));
  21. }
  22. });
  23. });
  24. window.onload = function () {
  25. var add = document.getElementById("add");
  26. add.onclick = function(){
  27. prompt("请添加课程:");
  28. }
  29. var txt = document.getElementById("txt");
  30. txt.onfocus = function(){
  31. if (txt.value == "请输入关键字"){
  32. txt.value = "";
  33. txt.style.color = "#333";
  34. }
  35. }
  36. txt.onblur = function () {
  37. if (txt.value == ""){
  38. txt.value = "请输入关键字";
  39. txt.style.color = "#ccc";
  40. }
  41. }
  42. //获取图片
  43. var img = document.getElementsByName("img");
  44. //鼠标经过图片
  45. for(i=0;i<img.length;i++){
  46. if(i%3==0){
  47. img[i].onmouseover = function () {
  48. this.src = "js/tree_themes/imgs/" + 1 + ".gif";
  49. }
  50. img[i].onclick = function(){
  51. $($(this).attr("id")+"form").style.display='block';
  52. }
  53. }else if(i%3==1){
  54. img[i].onmouseover = function () {
  55. this.src = "js/tree_themes/imgs/" + 2 + ".gif";
  56. }
  57. img[i].onclick = function(){
  58. var name = $(this).attr("id");
  59. if(confirm("确实要删除吗?")){
  60. window.location.href="DeleteServlet?name="+name;
  61. }
  62. }
  63. }else if(i%3==2){
  64. img[i].onmouseover = function () {
  65. this.src = "js/tree_themes/imgs/" + 3 + ".gif";
  66. }
  67. img[i].onclick = function(){
  68. alert($(this).attr("id"));//获取到了id
  69. }
  70. }
  71. img[i].onmouseout = function () {
  72. this.src = "js/tree_themes/imgs/0.png";
  73. }
  74. }
  75. }
  76. </script>
  77. </head>
  78. <body>
  79. <div align="center">
  80. <img id="school" src="js/tree_themes/imgs/school.png">
  81. </div>
  82. <div id="box">
  83. <input type="text" name="search" value="请输入关键字" id="txt">
  84. <div id="add">添加学科</div>
  85. <div id="search">搜索</div>
  86. </div>
  87. <div id="all">
  88. <div class="img">
  89. <!-- <img id="img" src="js/tree_themes/imgs/0.png">
  90. <img id="img" src="js/tree_themes/imgs/0.png">
  91. <img id="img" src="js/tree_themes/imgs/0.png"> -->
  92. </div>
  93. <form action="DisciplineAddServlet" >
  94. 学科名:<input type="text" name="discipline_name">
  95. <input type="submit" value="添加学科">
  96. </form>
  97. <form action="CourseAddServlet">
  98. 学科名:<input type="text" name="discipline_name">
  99. 课程名:<input type="text" name="course_name">
  100. <input type="submit" value="添加课程">
  101. </form>
  102. <div class="st_tree">
  103. <% Map<String,List<Course>> courseMap = (Map<String,List<Course>>)request.getAttribute("courseMap");
  104. Set<String> courseKeySet = courseMap.keySet();
  105. List<String> courseKeyList = new ArrayList<String>(courseKeySet);
  106. for(int i = 0;i < courseKeyList.size();i++)
  107. {
  108. String discipline = courseKeyList.get(i);
  109. List<Course> courseList = courseMap.get(discipline);
  110. int size = courseList.size();
  111. %>
  112. <ul>
  113. <li><a href="#"><%=discipline%></a><img id="<%=discipline%>" name="img" src="js/tree_themes/imgs/0.png">
  114. <img id="<%=discipline%>ds" name="img" src="js/tree_themes/imgs/0.png">
  115. <img name="img" src="js/tree_themes/imgs/0.png">
  116. <form id="<%=discipline%>form" action="" method="post" style="display: none">
  117. <input type="text" name="course_name">
  118. </form>
  119. </li>
  120. <ul>
  121. <c:forEach items="<%=courseList%>" var="course">
  122. <li><a href="#">${course.getCourse_name()}</a><img id="${course.getCourse_name()}x" name="img" src="js/tree_themes/imgs/0.png">
  123. <img id="${course.getCourse_name()}cs" name="img" src="js/tree_themes/imgs/0.png">
  124. <img name="img" src="js/tree_themes/imgs/0.png"></li>
  125. </c:forEach>
  126. </ul>
  127. </ul>
  128. <%
  129. }
  130. %>
  131. </div>
  132. <div id="photo">
  133. <img src="js/tree_themes/imgs/a.jpg" width="300px" height="300px">
  134. </div>
  135. </div>
  136. </body>
  137. </html>