티스토리 뷰

window.open 문법은 아래와 같다.


1
window.open(URL, name, specs, replace)




여기에서 두번째 파라미터인 'name'을 동일하게 줄 경우 이미 열려져 있는 팝업창에서 동일한 'name'을 찾아서 해당 URL을 열어준다. 찾는 'name'이 없다거나 동일하게 주지 않았거나 빈값("")으로 셋팅할 경우 새창으로 열린다. 

세번째 파라미터인 'specs'을 입력하지 않을 경우에는 'name'에 상관없이 Tab으로 열린다.


문제는 동일한 'name'을 세팅했는데도 불구하고 새창으로 열리는 경우가 있다는 것이다.

어떤글을 보면 버그라고 하고 어떤글은 크로스도메인 때문에 그렇다고 하는데 어느게 맞는건지 Microsoft 사이트에서 뒤져도 정확한 원인을 찾지 못했다.ㅜㅜ(정확하게 알고 계시거나 설명하는 사이트가 있다면 알려주시면 감사합니다)


원인은 정확히 모르지만 어느정도 해결방법은 stackoverflow에서 찾았다.


1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
<html>
<head>
</head>
<body>
<button onclick="fnOpenPop('A');">Naver</button>
<button onclick="fnOpenPop('B');">Google</button>
 
<script>
var winPop;
function fnOpenPop(divideParam){
var url = "";
 
        if(divideParam === "A") {
            url = "http://www.naver.com";
        }else {
            url = "http://www.google.co.kr";
        }
 
        if(!winPop || (winPop && winPop.closed) ) {
            winPop = window.open(url, "testId""left=10, top=10, width=1200, height=800");
        }else {
            winPop.location.href = url;
        }
}
 
</script>
</body>
</html>




window.open 메소드를 실행시키면 해당 팝업의 window객체를 넘겨주는데 이 객체를 변수('winPop')에 할당해서 해당 객체 유무와 closed 유무로 팝업이 열려있는지 판단해서 계속 하나의 팝업창에 열어줄 수 있다. 그런데 희한하게 같은 브라우저인데 해당 소스를 그냥 브라우저에서 열면 window.open 시 window 객체를 return해주지 못해 정상적으로 동작하지 않는다. 하지만 https://jsfiddle.net/ 같은 웹 환경에서 실행하면 정상적으로 window 객체를 return 해 준다. 아직까지는 무슨 차이인지 이해를 못하고 있다 ㅜㅜ(이것도 알고 계신분이 있다면 알려주시면 감사하겠습니다)


해결했습니다. -> ssunsband.tistory.com/151 



참고 사이트



댓글