>웹 프론트엔드 >JS 튜토리얼 >js_기본지식 중 window.open() 메소드 사용법에 대한 자세한 설명

js_기본지식 중 window.open() 메소드 사용법에 대한 자세한 설명

WBOY
WBOY원래의
2016-05-16 17:27:521009검색
1. Window.open() 지원 환경:
JavaScript1.0 /JScript1.0 /Nav2 /IE3 /Opera3

2. 🎜>window.open(pageURL,name,parameters) 여기서:
pageURL은 하위 창 경로입니다.
name은 하위 창 핸들입니다.
parameters는 창 매개변수입니다(각 매개변수는 구분되어 있습니다). 쉼표로)


3. 예:

<SCRIPT> <div class="codebody" id="code12516"><!-- <BR>window.open ('page.html','newwindow','height=100,width=400,top =0,left=0,toolbar=no ,menubar=no,scrollbars=no, resizing=no,location=no, status=no') <BR>//한 줄로 작성<BR>--> ></SCRIPT>


스크립트가 실행되면 page.html이 화면 상단에서 너비 100, 높이 400, 0픽셀의 새 창에 열립니다. , 화면 왼쪽에서 0픽셀, 도구 모음 없음, 메뉴 표시줄 없음, 스크롤 없음, 크기 조정 불가, 주소 표시줄 없음, 상태 표시줄 없음. 비교해주세요.
위의 예에는 일반적으로 사용되는 여러 매개변수가 포함되어 있습니다. 그 외에도 많은 매개변수가 있습니다. 4를 참조하세요.


4. 다양한 매개변수

그 중 yes/no도 사용할 수 있으며 픽셀 값은 특정 값이며 단위는 픽셀입니다. 매개변수 | 값 범위 | 설명

alwaysLowered | yes/no | 지정된 창이 모든 창 뒤에 숨겨집니다.
alwaysRaised | 🎜>종속됨 | 예/아니요 | 상위 창을 동시에 닫을지 여부
Nav2 및 3의 디렉터리 표시줄 표시 여부
높이 | 단축키 | 예/아니요 | 메뉴 표시줄이 없는 창에서 안전 종료 단축키 설정
innerHeight | 픽셀 값 | 창에 있는 문서의 픽셀 높이
innerWidth | 창
위치 | 예/아니요 | 위치 막대가 표시됩니까?
크기 조정 가능 | 예/아니요 | 창 크기 조정 가능 여부
스크롤바 | 창에 스크롤 막대가 있을 수 있음
제목 표시줄 표시 여부
도구 모음 표시 여부
픽셀 너비 | window
z-look | 예/아니요 | 창이 활성화된 후 다른 창 위에 떠 있는지 여부

================ === ================================

【1. ]
사실 코드는 매우 간단합니다.




코드 복사


코드는 다음과 같습니다.


사이에 배치해야 합니다. 는 일부 이전 브라우저에 효과적입니다. 이러한 이전 브라우저에서는 태그의 코드가 텍스트로 표시되지 않습니다. 이 좋은 습관을 기르십시오. Window.open('page.html')은 새 창인 page.html의 팝업을 제어하는 ​​데 사용됩니다. page.html이 기본 창과 동일한 경로에 없으면 경로를 명시해야 합니다. 전면에서는 절대 경로(http:// )와 상대 경로(../)를 사용할 수 있습니다. 작은따옴표나 큰따옴표를 사용할 수 있지만 혼합하지 마세요. 이 코드는 HTML의 와 사이, 사이에 추가할 수 있습니다. , 특히 페이지 코드가 긴 경우, 페이지가 더 일찍 나타나도록 하려면 최대한 앞쪽에 배치하세요.
【2. 설정 후 팝업창】

팝업창 설정에 대해 알아보겠습니다. 위의 코드에 조금 더 추가하면 됩니다.
이 팝업창의 모양, 크기, 팝업 위치를 페이지의 특정 조건에 맞게 맞춤설정해 보겠습니다.



코드 복사


코드는 다음과 같습니다.



매개변수 설명:
js 스크립트 종료

[3. 팝업 창 제어 기능을 사용하세요]

완전한 코드입니다.

코드 복사 코드는 다음과 같습니다.
head>



두 개의 팝업창에 가려지지 않도록 위쪽과 왼쪽을 이용하여 팝업창이 서로 가리지 않도록 위치를 조절해주세요. 마지막으로 위에서 언급한 네 가지 방법을 사용하여 호출할 수 있습니다.
참고: 두 창(newwindows 및 newwindow2)의 이름은 동일하지 않아야 하며 모두 비어 있어야 합니다. 좋아요?
[5. 메인창에 1.htm 파일이 열리면서 작은창인 page.html이 뜹니다]

메인창


코드 복사 코드는 다음과 같습니다.