How to see if the user click inside something? - javascript

Hey guys i have a little problem.
I have a page something like this:
<div id="the_box"><iframe src="somesite"></iframe></div>
I have the div on my page but inside the iframe theres a form from another site where i would like to know when the user clicked a button inside that frame, is there a easy way to register that a user clicked?

This is not possible due to browser security restrictions. Events are not allowed to propagate over iframe elements whose src attribute is an external domain.

No this cannot be done . Maximum you can know is when the user clicks anywhere on the iFrame. Not on any elements inside the IFrame , as that violates the browser rules and Internet protocols .

Related

Get iframe id using jquery or javascript? [duplicate]

In my page i have iframe code. When i click particluar link that i frame window enabled.it is a form.when i submit the form i get some hidden field values.how can i access those values in my parent page?.
Since your iframe src= a complete url, and not a relative path (i.e: /app/appsignup.jsp) I am going to assume this Iframe exists at another IP or domain than the original page. If this assumption is correct, then you are not going to be able to modify the Iframe's DOM due to cross site scripting security rules in most browsers.
If the parent site, and child iframe exist on the same top level domain, then you can use document.getElementById("iframe_id")
Edit to answer second question:
You can add an onLoad event to the iframe, and so long as the iframe only has 1 form, and the page only changes when submitted, and this is where you want to be redirected.
Here is an example, but know this will redirect the first time and not work!
What you will want to do is put a function in there, and then in the .js for that function check for the second onLoad...
<iframe name="signUp" id="signup" src="10.80.32.9:8080/app/appsignup.jsp"; width="650" height="500" onLoad="window.location('/index.html');">
You will not be able to access the iframe if it's on a different domain and/or port, as yours seem to be. The Same Origin Policy will prevent that.
There may be a workaround, depending on your use case. Maybe add some more details.

Listening from a iframe event

On my page (index.htm) i have a iframe inside a modal that loads a content i.e (pagex.htm) from a different domain (not owned by me).
This iframe with (pagex.htm) has a element with id (#close) that also have a onclick() event as below:
<a id="close-lite" class="ch-close" onclick="closeRender();" href="#">×</a>
In my index.htm i have my jquery/javascript and what im trying to do is to access the iframe and get the click event to close the modal that is inside my page (so im not trying to modify the iframe content). I have tried to use .content() but without sucess yet.
Perhaps is a cross domain policy ussue? how can i get around this?
How can i do this with javascript/jquery ?
The same-origin-policy prevents you from listening to what is going on in the Iframe.
Can be used postMessage().
http://robertnyman.com/2010/03/18/postmessage-in-html5-to-send-messages-between-windows-and-iframes/
But it works not in all browsers and needs init from both sides.

Make links inside an iframe open in a new window

I'm trying to display an map inside an iframe that has a needle which on mouseover shows some information about a certain company, the thing is once you click the link the page opens up inside the iframe which ruins the experience, so i was wondering is it possible to make the links inside an iframe open up in a new window instead perhaps using jquery or something similiar?
the code i have atm is
http://www.jsfiddle.net/rkd59/1/
Edit: the very least capture a click within the iframe so i might resize the iframe
You will need some kind of open API to do this properly, and Eniro doesn't provide one according to this page (in Swedish).
I would recommend you to use the Google Maps API v3 instead. I've made an example on jsFiddle that looks similar to that of Eniro.
I'll gladly give you more help with this, so just ask away!
You can't (or it is extremely hard to ) make events inside the iframe affect the parent page. This is to prevent attacks from XSS, or cross site scripting. Having said that, if the site within the iframe is on your own domain and you want to set up some extremely tricky ajaxing and php session IDs, maybe you could make something work, but even then I'm not sure. And I don't know if this would be a security hole, maybe someone else can speak to that. It would perhaps look like:
main page sets up session ID and passes that to the iframe url via a get variable
the iframe takes click information and sends it to a Session variable via an ajaxing call to a script on the server.
The main page then reads (how?) the session cookie and makes changes based on it's value.
All in all, you may find that it may be much simpler and more secure to acheive what you want using a different method.
Due this map is loaded inside an iFrame, it's not possible to run any javascript event listeners on the links, neither is it possible to change the html.
Please try the following:
<script>
x=document.querySelectorAll("a");
for(i=0;i<x.length;i++)
{
x[i].setAttribute("target","_blank");
}
</script>
Thus all links open in new frame.
To make a link popup in a new window you would usually use target="_blank" as such:
Go to Yahoo
However this will only work if you can modify the code you're showing within the iFrame
There is a partial solution.
You can add an absolutely positioned DIV tag over the top of the IFRAME and capture clicks on this instead. See example here shaded in 20% alpha red.
http://www.jsfiddle.net/rkd59/6/
However, this means that the map works in "read-only mode" and while you can capture the click event you wont know what link the user has clicked on.

Subscribe to javascript event in an iframe (facebook)

I have an application where I use an iframe for a facebook likebox.
I want to subscribe, in the main page, to the event when the user clicks on the like button in the iframe.
Basically as soon as the user likes the page I want him to be redirected to a page I'll specify.
What javascript command can I use?
Thanks
Unless your parent document is on the same domain as the Facebook Like frame, you can't script into it at all, for security reasons. This is the Same Origin Policy. It prevents you not only from detecting the click but also from impersonating the user, forcing them to perform actions (such as Liking you) without their consent.
You can try to place an element on top of the frame to detect clicks, but by intercepting the click you also stop it going through to the frame. About the best you can do is detect a hover over the area of the Like button and remove the covering element, allowing the user to click. This isn't reliable though since it'll catch all mouseovers.
You can hook this up to the button
onclick = "window.location('www.google.com')"
obviously replacing the URL with yours. But you might want to check if that's legal.

How to use onclick on a iframe tag

How to use onclick in iframe tag to call a javascript.
I basically want redirect to other page when a user clicks on a iframe.I have added the facebook like button my site which is a iframe code. So once he has clicked on the like button i want him to get redirected to a thank you page
EDIT:
i don't want to redirect the iframe but i want to redirect the main page on any interactivity with iframe. On solution is on focus or or on click on iframe i should be able to redirect. Can i at least do it.
You can't do that. Facebook's XFBML elements (like the 'Like' button) are on a different domain than your own (and only function that way); using Javascript to modify that frame isn't possible due to security restrictions.

Categories

Resources