Working with IFRAME in JavaScript - How to open a dynamic page in IFRAME using JavaScript
(Page 2 of 6 )
I contributed a few articles covering JavaScript on this website. If you are new to the JavaScript, I suggest you to go through those articles before reading further.
I already explained IFRAME in the previous section. Now, let us try to develop a simple script (JavaScript) which shows a user specified web page. Have a look at the following code:
<html>
<head>
<meta name="vs_targetSchema" content="http://schemas.microsoft.com/intellisense/ie5">
<script id="clientEventHandlersJS" language="javascript">
<!--
function ShowWebSite(val)
{
document.all.myFrame.src=val;
document.all.myFrame.style.visibility="visible";
}
function Button1_onclick() {
var v = document.all("txtWebSite").value;
ShowWebSite(v);
}
//-->
</script>
</head>
<body>
<iframe id="myFrame" frameborder="0" vspace="0" hspace="0" marginwidth="0" marginheight="0"
width="100" scrolling="yes" height="100" style="BORDER-RIGHT: black 1px solid; BORDER-TOP: black 1px solid; Z-INDEX: 999; LEFT: 20px; BORDER-LEFT: black 1px solid; BORDER-BOTTOM: black 1px solid; POSITION: absolute; TOP: 100px; visibility:hidden;">
</iframe>
<form id="form1">
Enter website:<input type="text" id="txtWebSite" NAME="txtWebSite" value="http://www.yahoo.com">
<input type="button" value="Show" id="Button1" name="Button1" onclick="return Button1_onclick()">
</form>
</body>
</html>
Actually, within the above code, the “meta” tag is not necessary. Since I developed the above code using Visual Studio.NET 2003 Enterprise Architect, it was automatically added to provide its full-featured mechanisms.
The code above is explained in the next section.
Next: How to open a dynamic page in IFRAME using JavaScript: discussion >>
More JavaScript Articles
More By Jagadish Chaterjee
/ 126 
