Is this possible in Javascript?

Pembar · 06-20-2009, 07:30 AM

I'm trying to create a webpage with two frames, top and bottom. The bottom could be any webpage beyond the webpage's control. I'd like the top frame to be able to do two things.

1. Allow the user to surf as per normal on the bottom frame. But the top frame should have access to information such as the current link for the bottom frame.

2. The top frame should be able to change the address of the bottom frame anytime it wants.

Thanks much.

Regards,
Pembar

Philip M · 06-20-2009, 07:33 AM

Not entirely sure that I understand what you are trying to do, but for security reasons JavaScript cannot access anything beyond the domain of the current page. This is known as the "same origin policy" and prevents a document or script loaded from one origin from getting or setting properties of a document from a different origin.

Pembar · 06-20-2009, 08:11 AM

Hello,

Thanks for your reply.

Imagine a webpage, my webpage main.html. It contains two frames, top and bottom.

Top frame will always be within my control, topframe.html. Bottom frame could point to a separate external site, say www.espn.com.

What I want to do is for the top frame to

1. Always know which webpage the bottom is at.

2. React to changes in the bottom frame, if the user clicks a link on the bottom page, the top frame "should" know, perhaps to log this information.

3. If needed, change the bottom webpage to another external site, say www.disney.com.

Regards,
Pembar

Philip M · 06-20-2009, 08:34 AM

As I said, for security reasons Javascript running on pages from one domain is not allowed to access anything from web pages that originated on a different domain. Any cross-frame Javascript that works when each of the frames is loaded from the same domain will fail to work when the frame being referenced has originated from a different domain.

It would be possible to do what you're attempting with a server-side script, but Javascript alone can't.

ninnypants · 06-20-2009, 08:44 AM

Actually you should be able to do what you're talking about if I understand correctly. With the document you should be able to change the lower frames src attribute, but as Philip_M has said for security reasons you will not be able to control any content in the lower frame that is not from your domain.

Pembar · 06-20-2009, 08:49 AM

I don't need the content, I just need to know

1. When the bottom frame changes src

2. which site it is currently on.

Regards,
Pembar

ninnypants · 06-20-2009, 08:50 AM

Then yes you can do that with javascript.

Pembar · 06-20-2009, 08:57 AM

Thanks.

Could you guide me a little further by suggesting which functions to look up on?

Do I

1. create an infinite loop in the top frame, always polling the bottom frame's source?

2. Or do I set up the bottom frame such that whenever the src is changed, to inform the top frame?

Regards,
Pembar

ninnypants · 06-20-2009, 09:04 AM

You'll probably want to use something like setinterval() to check the value of the lower frames src every so often.

Code:

function get_src(){
     lower_src = document.frames[1].src;
}
interval = setinterval('get_src()', 5000);// 5000 = 5 seconds

Pembar · 06-20-2009, 09:18 AM

hmm... I was thinking further, is it possible to react to a change in src in the bottom link rather than an infinite loop?

I'd like the change to be immediate, rather than waiting for 5 secs.

Philip M · 06-20-2009, 09:22 AM

Perhaps I lack imagination, but this is another example where I am finding it hard to work out what the point is.

if (lower-src = "www.vile pornostuff.com") {
alert ("Naughty Boy!);
window location = "www.disney.com"
}

But the user can visit vilepornostuff.com by himself.

ninnypants · 06-20-2009, 09:23 AM

I don't believe there is an onchange for the src you can speed up the interval though every 1000 is equal to one second so 500 would be half a second.

Pembar · 06-20-2009, 10:49 AM

Thanks once again, something is missing. Here's my code.

Code:

<html>
<frameset cols="20%,80%">
   <frame src="test8menu.html" name="menu">
 <frame src="test8main.html" name="main">
</frameset>
</html>

test8menu.html:

Code:

<html>
<head>
<script language="JavaScript">
function getFrames() {
	setInterval('getBottomURL()', 1000);
}
function getBottomURL()
{
document.getElementById("urlAddress").value=document.frames['main'].src;
//parent.main.location.href;
}

</script>
</head>

<body onLoad="getFrames()">

<input type="button" name="clickMe" id="urlAddress" value="CurrentURL"/>

</body>
</html>

setting the right side of the equation to "parent.main.location.href" has it set to test8main.html but it never changes after that.

In test8main.html, I have links to external sites, but as I am surfing on the main site, nothing changes in 'urlAddress'.

Regards,
Pembar

Pembar · 06-20-2009, 07:17 PM

I managed to minimize the code a little further. From what I understand, what I'm trying to do with javascript is not possible due to the security restriction.

Code:

<html>
<body>
<script language="JavaScript">
function myLocation() {
alert(document.all.myFrame.contentWindow.location);
}
</script>
<iframe id="myFrame" src="http://www.codingforums.com" style="width:200;">
</iframe>
<br>
<button onclick="myLocation();">Location of Frame</button>
</body>
</html>

Does anyone know a workaround? With other technologies perhaps.

Regards,
Pembar