<?xml version = "1.0" encoding = "utf-8"?> | |
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN" | |
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd"> | |
<!-- Fig. 11.13: window.html --> | |
<!-- Using the window object to create and modify child windows. --> | |
<html xmlns = "http://www.w3.org/1999/xhtml"> | |
<head> | |
<title>Using the Window Object</title> | |
<script type = "text/javascript"> | |
<!-- | |
var childWindow; // variable to control the child window | |
function createChildWindow() | |
{ | |
// these variables all contain either "yes" or "no" | |
// to enable or disable a feature in the child window | |
var toolBar; | |
var menuBar; | |
var scrollBars; | |
// determine whether the Tool Bar checkbox is checked | |
if ( document.getElementById( "toolBarCheckBox" ).checked ) | |
toolBar = "yes"; | |
else | |
toolBar = "no"; | |
// determine whether the Menu Bar checkbox is checked | |
if ( document.getElementById( "menuBarCheckBox" ).checked ) | |
menuBar = "yes"; | |
else | |
menuBar = "no"; | |
// determine whether the Scroll Bar checkbox is checked | |
if ( document.getElementById( "scrollBarsCheckBox" ).checked ) | |
scrollBars = "yes"; | |
else | |
scrollBars = "no"; | |
//display window with selected features | |
childWindow = window.open( "", "", | |
",toolbar = " + toolBar + | |
",menubar = " + menuBar + | |
",scrollbars = " + scrollBars ); | |
// disable buttons | |
document.getElementById( "closeButton" ).disabled = false; | |
document.getElementById( "modifyButton" ).disabled = false; | |
document.getElementById( "setURLButton" ).disabled = false; | |
} // end function createChildWindow | |
// insert text from the textbox in the child window | |
function modifyChildWindow() | |
{ | |
if ( childWindow.closed ) | |
alert( "You attempted to interact with a closed window" ); | |
else | |
childWindow.document.write( | |
document.getElementById( "textForChild" ).value ); | |
} // end function modifyChildWindow | |
// close the child window | |
function closeChildWindow() | |
{ | |
if ( childWindow.closed ) | |
alert( "You attempted to interact with a closed window" ); | |
else | |
childWindow.close(); | |
document.getElementById( "closeButton" ).disabled = true; | |
document.getElementById( "modifyButton" ).disabled = true; | |
document.getElementById( "setURLButton" ).disabled = true; | |
} // end function closeChildWindow | |
// set the URL of the child window to the URL | |
// in the parent window's myChildURL | |
function setChildWindowURL() | |
{ | |
if ( childWindow.closed ) | |
alert( "You attempted to interact with a closed window" ); | |
else | |
childWindow.location = | |
document.getElementById( "myChildURL" ).value; | |
} // end function setChildWindowURL | |
//--> | |
</script> | |
</head> | |
<body> | |
<h1>Hello, this is the main window</h1> | |
<p>Please check the features to enable for the child window<br/> | |
<input id = "toolBarCheckBox" type = "checkbox" value = "" | |
checked = "checked" /> | |
<label>Tool Bar</label> | |
<input id = "menuBarCheckBox" type = "checkbox" value = "" | |
checked = "checked" /> | |
<label>Menu Bar</label> | |
<input id = "scrollBarsCheckBox" type = "checkbox" value = "" | |
checked = "checked" /> | |
<label>Scroll Bars</label></p> | |
<p>Please enter the text that you would like to display | |
in the child window<br/> | |
<input id = "textForChild" type = "text" | |
value = "<h1>Hello, I am a child window.</h1> " /> | |
<input id = "createButton" type = "button" | |
value = "Create Child Window" onclick = "createChildWindow()" /> | |
<input id= "modifyButton" type = "button" value = "Modify Child Window" | |
onclick = "modifyChildWindow()" disabled = "disabled" /> | |
<input id = "closeButton" type = "button" value = "Close Child Window" | |
onclick = "closeChildWindow()" disabled = "disabled" /></p> | |
<p>The other window's URL is: <br/> | |
<input id = "myChildURL" type = "text" value = "./" /> | |
<input id = "setURLButton" type = "button" value = "Set Child URL" | |
onclick = "setChildWindowURL()" disabled = "disabled" /></p> | |
</body> | |
</html>
key in title desired in the url tab then click ceate child window button. when already child window pop out, click the set child url button. the adrress of the window will change
|
Wednesday, 24 February 2016
create child window
Subscribe to:
Post Comments (Atom)
No comments:
Post a Comment