onclick 현재창/새창/팝업창 페이지 이동

 

자바스크립트에서 유용하게 사용되는 onclick. 모든 브라우저에서 지원이 된다.

 

 

불가피하게 링크 태크 a 사용이 어려운 경우 onclick으로 링크 연결을 하는 경우가 종종 있는데, onclick으로도 이동할 페이지를 현재창/새창/상위프레임/팝업으로 다양하게 열 수 있다.

 

 

1. 현재창에서 열 때

onclick="location.href='링크주소'"

 

2. 새창으로 열 때

onclick="window.open('링크주소')"

 

3. 상위 프레임에서 열 때

onclick="parent.location.href='링크주소'"

 

4. 팝업창으로 열 때

onclick="window.open('링크주소','창이름','width=가로사이즈,height=세로사이즈,left=왼쪽위치,top=상단위치');"

 

팝업의 경우 옵션이 많은데 아쉽게도 크롬에서 사용할 수 있는 옵션은 몇개 없다.

• width=500 : 팝업창 너비 (단위 : px)
• height=500 : 팝업창 높이 (단위 : px)
• left=0 : 왼쪽으로부터의 위치 
• top=0 : 위쪽으로부터의 위치

 

[크롬에서는 지원 안되는 옵션]

• titlebar=yes|no|1|0 : 타이틀바 표시 여부. 
• menubar=yes|no|1|0 : 메뉴바 사용 여부
• toolbar=yes|no|1|0 : 툴바 표시 여부. IE, Firefox에서 작동.
• location=yes|no|1|0 : 주소 표시줄 사용여부 Opera에서만 작동.
• status=yes|no|1|0 : 하단 상태바창 표시 여부
• scrollbars=yes|no|1|0 : 스크롤바 여부. IE, Firefox, Opera에서 작동
• fullscreen=yes|no|1|0 : 전체화면 모드. IE에서만 작동.
• channelmode=yes|no|1|0 : 전체화면으로 창이 열림. IE에서만 작동.
• resizable=yes|no|1|0 : 창 리사이즈 가능 여부. IE에서만 작동

 

window.open() 옵션에 대한 자세한 설명은 https://developer.mozilla.org/ko/docs/Web/API/Window/open 참고

 

 

 

5. 프레임 지정

onclick="타켓명.location.href='링크주소'"