JavaScript—window object usage example_basic knowledge

The window object is the top-level object in the JavaScript browser object model and contains multiple common methods and properties:

1 Open a new window

Copy code The code is as follows:

window.open(pageURL,name,parameters)

Where:

pageURL is the child window Path

name is the child window handle

parameters are window parameters (each parameter is separated by commas)

For example:

Copy code The code is as follows:

window.open("http://www.cnblogs.com/zhouhb/","open",'height =100,width=400,top=0,left=0,toolbar=no,menubar=no,scrollbars=no,resizable=no,location=no,status=no');

2 Open the modal window

Copy the code The code is as follows:

window.showModalDialog("http:/ /www.cnblogs.com/zhouhb/","open","toolbars=0;width=200;height=200");

3 Close the window without popping up the prompt box

If the web page is not opened through a script program (window.open()), before calling the window.close() script to close the window, the window.opener object must be set to null, otherwise the browser (IE7, IE8) will A dialog box pops up to confirm closing.

Copy code The code is as follows:

or

For close Frame window

Copy code The code is as follows:

4 location object uses

Copy code The code is as follows:

window.location.reload();//Refresh the current page
window.location.href="http://www.cnblogs.com/zhouhb/"; / /Load other pages

5 The history object uses

Copy code The code is as follows:

window.history.go(1); //Forward
window.history.go(-1); //Backward

6 Child form to parent window Body-passed value

6.1 Simple method

(1) Open the child form in the parent form

Copy code The code is as follows:

var str=window.showModalDialog("s.html");
if(str!=null)
{
var v=document.getElementById("v");
v.value =str;
}

(2) Subform code

Copy code The code is as follows:

var v=document.getElementById("v");
window.parent.returnValue=v .value;

window.close();

In addition, for the window opened by showModalDialog, you can also pass the value through dialogArguments:

Parent window code:

Copy code The code is as follows:

Sub window code:

Copy code The code is as follows:

< ;form>

For the window opened by showModalDialog, you can also pass window.returnValue Pass value:

Main window:

Copy code The code is as follows:

(2) Open window

Copy code The code is as follows:

HEAD>

Account information:

Please keep your account properly Information to avoid loss

Account:

Password:

6.2 A more detailed introduction

As we all know, the window.open() function can be used to open a new window, so how? When passing values ​​from the child form to the parent form, you can actually get the reference to the parent form through window.opener.
For example, if we create a new form FatherPage.htm:

Copy the code The code is as follows:

그런 다음 ChildPage.htm에서 window.opener를 통해 상위 양식의 요소에 액세스할 수 있습니다.

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

" id ="txtInput" />

사실, subform을 사용하면 window.open 함수도 하위 양식에 대한 참조를 반환하므로 FatherPage.htm을 다음과 같이 수정할 수 있으므로 하위 양식의 요소에 값을 할당할 수도 있습니다.

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

하위 양식의 참조가 비어 있는지 판단하여 하나의 하위 양식만 열도록 제어할 수도 있습니다.

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

="button" value=" OpenChild" onclick="OpenChildWindow()" />


이것만으로는 충분하지 않습니다. 그렇지 않으면 하위 양식을 연 후에는 다시 열 수 없습니다.

코드 복사

코드는 다음과 같습니다. 🎜> 함수 SetValue() {

창 .opener.document.getElementById('txtInput') .value

=document.getElementById('txtInput').value;
window.close()
}
function Unload()
{
window.opener.child= null
}

type="button" value="SetFather" onclick ="SetValue()" />