Popup

콜라맘·2023λ…„ 6μ›” 27일
0

JSP

λͺ©λ‘ 보기
17/17
post-thumbnail

🏁 Popup (μƒˆμ°½μ—μ„œ μ—΄κΈ°)

βœ” index.jsp >>

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<%@ taglib prefix="c" uri="http://java.sun.com/jsp/jstl/core" %>
<c:url value="/resources/js/popup/index.js" var="js1"/>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>νŒμ—…μ°½ μ—΄κΈ°</title>
</head>
<body>
	<input id="addr" type="text" />
	<button id="btn1">νŒμ—… μ—΄κΈ°</button>

<!-- c:urlμ—μ„œ μ„€μ •ν•œ var 값을 주면됨 -->
	<script src="${js1}"></script>

</body>
</html>

βœ” popup.jsp >>

<%@ page language="java" contentType="text/html; charset=EUC-KR"
    pageEncoding="EUC-KR"%>
<!DOCTYPE html>
<html>
<head>
<meta charset="EUC-KR">
<title>λ²„νŠΌμ„ λˆ„λ₯΄λ©΄ μƒˆμ°½μ—μ„œ μ—΄λ¦¬λŠ” νŒμ—…μ°½μž…λ‹ˆλ‹€</title>
</head>
<body>
	μƒˆ μ°½μ—μ„œ 열릴 λ‚΄μš©μž…λ‹ˆλ‹€ ... <br>
	<br>
	이 νŒμ—…μ°½μ„ μ—° λΆ€λͺ¨μ°½μ€ openerλΌλŠ” 객체둜 μ ‘κ·Όν•  수 μžˆλ‹€. <br>
	<script src="<%=request.getContextPath() %>/resources/js/popup/popup.js"></script>
</body>
</html>

βœ” index.js >>

const btn1 = document.getElementById('btn1');
btn1.addEventListener('click',(e)=> {
	window.open('./popup.jsp','_blank',
	'width=500, height=500, top=100, left=100'); // μƒˆ 창을 μ—΄μ–΄μ£ΌλŠ” μžλ°”μŠ€ν¬λ¦½νŠΈ ν•¨μˆ˜
});

βœ” popup.js >>

//opener : 이 창을 μ—° λΆ€λͺ¨ 객체 window
console.log(opener);
console.log(opener.document.getElementById('addr'));
opener.document.getElementById('addr').value='apple';
opener.document.body.style.backgroundColor='green';

πŸ“Ί ν™”λ©΄ 좜λ ₯ >>

νŒμ—…μ—΄κΈ° λ²„νŠΌμ„ λˆŒλ €μ„ λ•Œ >>
νŒμ—… >>

index.jsp ν™”λ©΄ >>

νŒμ—… μ˜΅μ…˜ μ°Έκ³ 

profile
콜라맘 코딩일기

0개의 λŒ“κΈ€