JSP - JavaScript window.open, close (2020-09-16)
2022. 9. 18. 22:25ㆍ3층 1구역 - 개발의 장/JSP
1. 서론
이번엔 window.open과 close에 알아보도록 하자.
2. 본론
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ex25</title>
<script type="text/javascript">
function myClick() {
window.open("https://www.melon.com/song/detail.htm?songId=2093044", "width=1000, height=800, top=100, left=300")
//window.open("https://www.melon.com/song/detail.htm?songId=2093044", "_self", "width=1000, height=800, top=100, left=300") 현재 페이지
//window.open("https://www.melon.com/song/detail.htm?songId=2093044", "_black", "width=1000, height=800, top=100, left=300") 새로운 창
//window.open("https://www.melon.com/song/detail.htm?songId=2093044", "", "width=1000, height=800, top=100, left=300") 새로운 창
//window.open("https://www.melon.com/song/detail.htm?songId=2093044", "width=1000, height=800, top=100, left=300") 새 탭
}
</script>
</head>
<body>
<!-- <input type = "button" value = "새창" onclick= "myClick()"> -->
<label onclick="myClick()">달이 차오른다 가자</label>
</body>
</html>
위 코드는 label태그에 있는 텍스트를 클릭했을 때 window.open 괄호에 넣어둔 링크로 갈 수 있다.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ex26-1</title>
<script type="text/javascript">
function myClick() {
window.open("ex26-2.jsp", "", "width=1000, height=800")
}
</script>
</head>
<body onload="myClick()">
<!-- <input type = "button" value = "새창" onclick= "myClick()"> -->
</body>
</html>
위 코드는 body태그에 onload라는 이벤트를 주어 다음 웹사이트를 열었을 때, 팝업창이 나오도록 한 것이다.
<%@ page language="java" contentType="text/html; charset=UTF-8"
pageEncoding="UTF-8"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>ex26-2</title>
<script type="text/javascript">
function window.close() {
window.close()
}
</script>
</head>
<body>
<h1>공 지 사 항</h1>
<p>
재활용 쓰레기 봉투를 무료로 나눠드리고 있사오니, 마을회관에서 받아가시길 바랍니다.
누구는 줬네 안 줬네 하지 마시고 지금 바로 마을회관으로 오셔서 받아가시면
감사하겠습니다. :-)
</p>
<input type="checkbox" onclick="window.close()"> 하루 동안 닫기
</body>
</html>
위 코드는 26-1.jsp 웹을 열었을 때, 자동으로 나오는 팝업창이다.
checkbox에 window.close를 주어 checkbox에 체크했을 때 사라지도록 했다.
단, 현재 시간 지정이라던가 그런 것은 주어지지 않았기 때문에 '하루 동안 닫기' 같은 기믹은 작동하지 않는다.
'3층 1구역 - 개발의 장 > JSP' 카테고리의 다른 글
JSP - 확장자 별로 나누기 (2020-09-16) (0) | 2022.09.19 |
---|---|
JSP - JavaScript 비밀번호 길이 검사하는 퀴즈 (2020-09-16) (0) | 2022.09.18 |
JSP - JavaScript Alert과 confirm (2020-09-16) (0) | 2022.09.18 |
JSP - JavaScript 다음 페이지로 넘기기 (2022-09-16) (0) | 2022.09.18 |
JSP - JavaScript mousedown, mouseup (2022-09-16) (0) | 2022.09.18 |