[JS] JavaScript 팝업창(새창) 띄우기

JS(JavaScript)에서 팝업창(popup)을 여는 방법 및 속성이다.

window.open() 속성

window.open(url, name, specs, replace);

1.url

주소에 해당되며 비워두면 빈 창(about:blank)이 나온다.

2.name

_blank : 새 창으로 열린다. (기본값)

_parent : 부모 페이지에서 열린다.

_self : 현재 페이지를 변경한다.

_top : 현재 페이지의 최상의 페이지에서 열린다.

사용자 임의 지정 : 지정한 이름의 새 창으로 열린다.

3.specs

옵션

 

yes/no 또는 1/0 으로 사용한다.

기본값은 yes(1) 이다.

 

menubar	메뉴바 사용
toolbar	툴바 사용
scrollbars	스크롤바 사용
resizeable	사이즈 변경 허용
location	메뉴 아이콘 표시
fullscreen	전체화면
status	하단 상태바 표시

사이즈

 

px(픽셀) 단위이며 숫자만 입력해도 된다.

 

width	팝업창 가로크기 지정
height	팝업창 세로크기 지정
left	왼쪽에서부터의 위치 지정
top	위쪽에서부터의 위치 지정

 

4.replace

히스토리 목록에 새 항목을 만들지 현재 항목을 대체할지 지정한다. (기본값 false)

 

true : 현재 히스토리를 변경한다.

false : 히스토리에 새 항목을 만든다.

 

방문한 페이지(검색기록)에서 확인 할 수 있다.

사용 예제

// 1.
<button onclick ="window.open('www.google.com','test','width=500,height=500,resizable=no')"></button>

// 2.
<button onclick ="popup();"></button>

<script>
    function popup(){
  		window.open('www.naver.com','팝업','width=500,height=500');                 
    };
</script>