JavaScript 는 웹 페이지 의 임의의 위 치 를 누 르 면 새 창 을 열 고 창 을 닫 는 방법 을 실현 합 니 다.
3090 단어 JavaScript새 창 열기창 닫 기
일부 비정 규 직 사이트,특히 광고 가 가득 걸 린 다운로드 소 에 서 는 클릭 한 다운로드 링크 를 클릭 하기 전에 웹 페이지 의 어느 곳 을 클릭 하 든 새 창 이 뜨 곤 한다.
이러한 효 과 는 자 바스 크 립 트 로 쉽게 할 수 있 으 며,특정 영역 을 클릭 한 Div 를 지정 해 야 새 창 을 여 는 이 벤트 를 촉발 할 수 있 습 니 다.
예 를 들 어 다음 그림 의 효과:
원래 홈 페이지 에 서 는 Div 를 지정 합 니 다.사용자 가 이 Div 의 임의의 영역 을 클릭 하 더 라 도 새 창 을 열 고 다른 곳 을 클릭 하면 그렇지 않 습 니 다.
새 창의 주소 표시 줄 에 서 는 편집 할 수 없고 크기 를 조정 할 수 없습니다.'닫 기'단 추 를 제공 하여 이 창 을 닫 습 니 다.
원래 웹 페이지 의 HTML 레이아웃 은 다음 과 같 습 니 다.
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Untitled Document</title>
</head>
<body>
<div class="testClass" style="height:100px;border:1px solid #cccccc"> </div>
</body>
</html>
관건 은 다음 각본 이다.
<script type="text/javascript">
document.onclick = function(e){//
e = e || window.event;// 。
var target = e.target || e.srcElement;// 。 。
if (target.className == "testClass"){// ，class testClass， 。
var OpenWindow=window.open("","newwindow","height=100","width=400","top=100","left=0","toolbar=false","menubar=false","scrollbars=false","resizable=false","location=false","status=false");
// HTML 。
OpenWindow.document.write(" <br/>");
// Javascript ， window.close() ， ， ，
OpenWindow.document.write("<button onclick='javascript:window.close()'> ！</button>");
}
}
</script>
window.open()이 방법 은 매개 변수 가 매우 깁 니 다.그 중:
첫 번 째 매개 변 수 는 비어 있다 는 뜻 입 니 다.새 창의 링크 는 기 존 웹 페이지 가 아니 라 는 뜻 입 니 다.새 창의 내용 은 아래 두 줄 의 자바 script 을 통 해 생 성 되 었 습 니 다.새 창의 내용 이 기 존 웹 페이지 라 고 요구 하면 해당 url 을 작성 합 니 다.
그 후의 매개 변 수 는 다음 과 같은 뜻 이지 만 IE 에 만 유효 합 니 다.
new window:팝 업 창의 이름(파일 이름 이 아 닙 니 다),필요 하지 않 으 면 빈'으로 대체 할 수 있 습 니 다.
height=100:새 창 높이.
새 창 너비.
top=0:새 창 은 현재 창 위의 픽 셀 값 에서 떨 어 집 니 다.
왼쪽=0:창 은 현재 창 왼쪽 에 있 는 픽 셀 값 입 니 다.
toolbar=false:도구 모음,menubar,scrollbars 는 메뉴 표시 줄 과 스크롤 바 를 표시 할 지 여부 입 니 다.
resizable=false:창 크기 를 변경 할 수 있 습 니까?
location=false:새 창 주소 표시 줄 을 사용 할 지 여부
status=false:상태 표시 줄 을 표시 할 지 여부 입 니 다.
자 바스 크 립 트 관련 내용 에 관심 이 있 는 독자 들 은 본 사이트 의 주 제 를 볼 수 있다.
본 고 에서 말 한 것 이 여러분 의 자 바스 크 립 트 프로 그래 밍 에 도움 이 되 기 를 바 랍 니 다.
이 내용에 흥미가 있습니까?
현재 기사가 여러분의 문제를 해결하지 못하는 경우 AI 엔진은 머신러닝 분석(스마트 모델이 방금 만들어져 부정확한 경우가 있을 수 있음)을 통해 가장 유사한 기사를 추천합니다:
기초 정리 - 1문자 (String) 숫자 (Number) 불린 (Boolean) null undefined 심볼 (Symbol) 큰정수 (BigInt) 따옴표로 묶어 있어야 함 Not-A-Number - 숫자 데이터 / 숫자로 표...
텍스트를 자유롭게 공유하거나 복사할 수 있습니다.하지만 이 문서의 URL은 참조 URL로 남겨 두십시오.
CC BY-SA 2.5, CC BY-SA 3.0 및 CC BY-SA 4.0에 따라 라이센스가 부여됩니다.
좋은 웹페이지 즐겨찾기
