?
Solved

Detecting the link click in an iframe

Posted on 2004-09-17
9
Medium Priority
?
463 Views
Last Modified: 2008-02-01
Hi All,

I can detect the link clicks with "document.onclick=function()" function but there is an iframe in the document and i want to detect the link clicks in that iframe also. I tried "document.getElementById("innerframeID").onclick=function()" but it didn't work.

How can i perform this?

Thanks!
0
Comment
Question by:blacklord
  • 4
  • 2
7 Comments
 
LVL 36

Expert Comment

by:Zyloch
ID: 12082650
This isn't possible as far as I know.

The iframe is a whole separate document.

window.onclick functions the same as document.onclick and doesn't do anything.
Putting an onclick handler inside the iframe tag is fruitless because the iframe is considered a separate document.
Notice how if you have an onclick inside the iframe, and you click the border of the iframe, the action executes? That's what handlers in the iframe do.

Because the iframe is a different document, there's nothing you can do.

You can use a server-side language like PHP or ASP to include the file into your page. It won't be an iframe then and will be part of the document. Or you can use XMLHTTP client side, which although works, is only supported by recent browsers, for example:

<script language="javascript" type="text/javascript">
<!--

function getDoc(path) {
   if (document.all) {
      var xObj=new ActiveXObject("Microsoft.XMLHTTP");
      xObj.open("GET",path,false);
      xObj.send();
      return(xObj.responseText);
   } else {
      var xObj=new XMLHTTPRequest();
      xObj.open("GET",path,false);
      xObj.send(null);
      return(xObj.responseText);
   }
}

//-->
</script>

which will return the contents of the page specified in path.
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 12082655
I can show hot that event capture works, but I need more details.
First question: why does not the page in the iframe react to the clicks itself?
Second question: where is the function which has to be called in onClick handler? Is it the main parent document?
And last but most important: do you want to handle the click when anywere on the iframe is clicked or only when some links or other elements are clciked?

0
 
LVL 63

Expert Comment

by:Zvonko
ID: 12082661
Hello Zyloch. Do you have again sleeping problems? Now you are in my time zone :-)
0
Concerto's Cloud Advisory Services

Want to avoid the missteps to gaining all the benefits of the cloud? Learn more about the different assessment options from our Cloud Advisory team.

 
LVL 63

Accepted Solution

by:
Zvonko earned 1000 total points
ID: 12082700
And this is for Zyloch only:

<html>
<head>
<script>
function myFunction(){
  e=frames.innerframeID.event;
  window.status=e.clientX+":"+e.clientY;
}
</script>
</head>
<body>
<h1>Look into status bar</h1>
<iframe name="innerframeID" onLoad="frames.innerframeID.document.onmousemove=myFunction" height="100%" width="100%">
</iframe>
</body>
</html>

0
 
LVL 36

Expert Comment

by:Zyloch
ID: 12082739
Wow, I never knew that. Shows how much I know, eh? lol

Thanks Zvonko, once again, for showing me the light. And now, I believe I can fall asleep peacefully :-) (no, this is not sarcasm, I'm just tired)

O.O -> o.o -> -_- -> x_x

Till later,
Zyloch
0
 
LVL 63

Expert Comment

by:Zvonko
ID: 12082748
Good Nigth :-)
0
 
LVL 9

Expert Comment

by:cwolves
ID: 12084212
<iframe id="ifr" src="page.html"></iframe>
<script language="javascript">
frames.ifr.document.onclick=function(){alert('test');}
</script>
0

Featured Post

[Webinar] Cloud and Mobile-First Strategy

Maybe you’ve fully adopted the cloud since the beginning. Or maybe you started with on-prem resources but are pursuing a “cloud and mobile first” strategy. Getting to that end state has its challenges. Discover how to build out a 100% cloud and mobile IT strategy in this webinar.

Question has a verified solution.

If you are experiencing a similar issue, please ask a related question

I've been trying to accomplish this for a while and it just struck me yesterday how to accomplish this task. I have done searches all over the internet looking for ways to email pages from my applications and finally I have done it!!! Every single s…
Having worked on larger scale sites, we found out that you are bound to look at more scalable solutions to integrating widgets, code snippets or complete applications and mesh them into functional sites, in any given composition. To share some of…
The viewer will learn the basics of jQuery, including how to invoke it on a web page. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery.: (CODE)
The viewer will learn the basics of jQuery including how to code hide show and toggles. Reference your jQuery libraries: (CODE) Include your new external js/jQuery file: (CODE) Write your first lines of code to setup your site for jQuery…
Suggested Courses

850 members asked questions and received personalized solutions in the past 7 days.

Join the community of 500,000 technology professionals and ask your questions.

Join & Ask a Question