위와 같이 이미지를 출력해보자
bookTest.jsp
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<title>bookTest.jsp</title>
<script src="../js/jquery-3.6.1.min.js"></script>
</head>
<body>
<h3>교재선택</h3>
<select name="book" id="book">
<option>--선택 --</option>
<option value="0">spring</option>
<option value="1">Android</option>
<option value="2">jQuery</option>
<option value="3">javaScript</option>
</select>
<br>
<div id="display"></div>
<script>
</script>
</body>
</html>
패키지와 클래스 생성
BookCont.java
package kr.co.itwill.book;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.RequestMapping;
@Controller
public class BookCont {
public BookCont() {
System.out.println("-----BookCont()객체 생성됨");
}//end
//결과 확인 http://localhost:9095/book/book.do
@RequestMapping("book/book.do")
public String bookTest() {
return "book/bookTest";
}//bookTest() end
}//class end
@RequestMapping("book/booksend.do")
@ResponseBody
public String bookSend(HttpServletRequest req) {
//요청한 정보 가져오기
int bookIndex = Integer.parseInt(req.getParameter("book"));
String img[] = {"spring.jpg", "android.jpg", "jquery.jpg", "jsmasterbook.jpg"};
return img[bookIndex]; //응답메시지
}//bookSend() end
bookTest.jsp
<script>
$("#book").change(function(){
//alert($(this).val());
$.post(
"booksend.do"
,"book=" + $(this).val()
, responseProc
);
});//change() end
function responseProc(result) {
$("#display").html("<img src='../images/" + result + "'>");
}//responseProc() end
</script>
'웹개발 교육 > Spring' 카테고리의 다른 글
| [74일] Spring (18) - MyBatis 프로젝트 (설정, 첫페이지, 목록) (0) | 2022.11.10 |
|---|---|
| [74일] Spring (17) - Ajax 검색 (0) | 2022.11.10 |
| [73일] Spring (15) - Ajax 아이디 중복 확인(cookie) (0) | 2022.11.09 |
| [73일] Spring (14) Ajax - 서버에서 응답 받기 (0) | 2022.11.09 |
| [71일] spring (13) - mymelon 호스팅 (0) | 2022.11.07 |
