Close child window once loaded in jQuery - javascript

I'm trying to write a JS/jQuery script that opens a whole load of links from a page in child windows, then closes each child window once it has loaded. This is because once the child page has loaded, it triggers a download, and I then need the child page to close. I've tried a variety of things, but none of them seem to work, perhaps someone can help me?
Here's an example of something I was trying:
var imgURL = "http://...etc";
var imgWindow = window.open(imgURL);
imgWindow.ready(function(){
this.close();
});
Would really appreciate any suggestions how to get this to work, bit stuck!

The below code will open a new window and closes after that window is loaded.
var imgURL = "http://yourdomain.com/imagePage.html";
var imgWindow = window.open(imgURL);
imgWindow.onload = function(){
imgWindow.close();
};
This will work only if the child window is from the same domain. If the URL of the child window is not the same domain, you can't do anything. That would be a XSS vulnerability.

The main problem with your code above is that there is not ready method for a window object.
Try this :
var imgURL = "http://google.com";
var imgWindow = window.open(imgURL);
imgWindow.addEventListener('load', imgWindow.close(), true);

Related

How To close the new window automatically when the redirect url API is hit

Hello i am using the react js and i am open a new window using this method.
var newWindow = window.open(
this.state.url,
'myWindow',
"location=yes,width=600,height=600"
)
Using this method a new window is open and a redirection url is open and getting the response in new window i just want to close new window pop up after getting response.
the redirection link is actually a api link in which i am sending the response.
Help me get out of this.
Thanks
you can get the event loadstop of newwindow and then close it.
I think this approach will solve your Issue. At leas if you open the new Window interaktiv. Automatically close browser/tab without opening it by javascript
Snippet from the other post which should be part of the response (dont know if possible in your case).
<script language="JavaScript" type="text/javascript">
function winClose() {
window.setTimeout("window.close();",2000)
}
</script>
You have newWindow reference to your window pop up. Now you can listen onload method which gets fired once your window is fully loaded with content and dom is generated. Refer here. DO your stuff inside this funciton.
newWindow.onload = function() {
// do your stuff here
newWindow.close()
};

Get title of child window after it loads fully

I need to detect changes in the title of a window for OAuth.
I have a link that opens the authentication page in a new window, and I'm just trying to pull the title data. However, for some reason the page doesn't load until all my code executes so the title it finds is just an empty string.
$("#signon").on("click", function () {
var url = $(this).data('authurl');
var handle = window.open(url);
var title = window.document.title;
var title2 = handle.document.title;
});
title is fine, but title2 is null and the handle window hasn't loaded.
I've tried .ready, .onload, .load, and an eventListener, but none of them made a difference.
Why isn't the child window loading any data until this code completes?

Access a window by window name

If I open a window using
window.open('myurl.html', 'windowname', 'width=100,height=100');
How do I refer to the new window (from the same page that opened it) using 'windowname'? This question is specifically about this. I'm aware that I could save a reference to the handle by using "var mywin = window.open(...)" but I don't care about that in this situation.
Thanks, - Dave
In firefox (might work in other browsers too, but now it's not my concern) I was able to reference one window accross multiple page loads with
var w = window.open("", "nameofwindow");
This opens new window if it doesn't exist and return reference to existing window if it does exist without changing contents of the window.
With jQuery I was then able to append new content, to make quick collection of interresting links like this
$('body', w.document).append(link_tag);
If you didn't save a reference to the window then there is no way to restore it. However, if that window is still open and if the page loaded there belongs to the same domain as your page, you can run JavaScript code in it:
window.open("javascript:doSomething()", "windowname");
Whether that's sufficient in your scenario depends on what you are trying to achieve.
Petr is correct:
var w = window.open("", "nameofwindow");
works in all browsers, I am using it to retrieve the reference to the window object previously opened by a different page. The only problem is the initial opening of the page, if the popup does not exist, you will get a new window with a blank page.
I tried invoking a Javascript function inside the context of the other document in order to check whether I opened a new window or retrieved the already active page. If the check fails, I just invoke window.open again to actually load my popup content:
var w = window.open("http://mydomain.com/myPopup", "nameofwindow");
Hope that helps.
It is not possible. The windowName is just to be used in target="..." of links/forms or to use the same name again in another window.open call to open a new url in that window.
Try open that window with the name, but URL is '' again, to check if it's a blank window or not. If it's in open, then you will get the window; if not, a new window open, and you need close it.
Add the children in localStorage will help to prevent to open the new blank window.
Please check my code in https://github.com/goldentom66/ParentChildWindow
Sorry I am posting late, but if you still have the other window open, and they are on the same domain, you can run, on the first window:
function getReference(w) {
console.log('Hello from', w);
}
And on the second window:
window.opener.getReference(window);
afaik there's no way like windows['windowname'].
The 'windowname' assigned in window.open() can be addressed as a target in <a target="windowname" [...] >

Detaching/opening an iframe into a new window

I have an iframe setup within a page and basically want to know whether it's possible to have a button in this iframe and when pressed, opens the iframe into a new browser window, showing the contents of the iframe.
I am planning on using either JavaScript or jQuery to achieve this. I am using IE6.
$('.button').click( function(){
window.open($('iframe').attr('src'),'mywindow','width=400,height=200');
});
For what you need (to open the same page where this button), no matter if it's an iframe or if in the home page.
The only difference is if you want that data to open in new window, are a reflection of the same page, such as data that can be an input.
If you care about who are the same data:
$("#mybuttonOpenWin").click(function(){
window.open(window.location.href);
});
If you are interested, you can try this code:
$("#mybuttonOpenWin").click(function(){
var mref = window.open(window.location.href);
(function = onReadyRef(xref){
if(xref.window.document.readyState=="complete"){
$(xref.window.document).find("body").html($("body").html());
}
else{
onReadyRef.call(this, xref);
}
})(mref);
});

Telling when an iframe is on a new URL

I am using JavaScript to make a small iframe application, and I cannot seem to figure out a way to update the URL in my URL bar I made when someone clicks a link inside the iframe.
It needs to be instantaneous, and preferably without checking every millisecond whether or not the value of document.getElementById('idofiframe').src has changed.
I can't seem to find a simple property to tell when the url has changed, so if there is not one, then solving this programmatically will work as well.
Thanks for the help!
This will be difficult to do because it is considered xss and most browsers block that.
There are most likely some workarounds involving AJAX.
First of all, what you want to do will be possible only if the source of your iframe points to the same domain as the parent window. So if you have a page page.html that iframes another page iframed.html, then both of them have to reside on the same domain (e.g. www.example.com/page.html and www.example.com/iframed.html)
If that is the case, you can do the following in the iframed.html page:
<script type="text/javascript">
window.onload = function() {
var links = document.getElementsByTagName('a');
for (var i=0, link; link = links[i]; i++) {
link.onclick = function() {
window.parent.location.href = '#' + encodeURIComponent(this.href);
}
}
}
</script>
This will make it so that whenever you click on a link in iframed.html, the url bar will put the url of the link in the "hash tag" of the url (e.g. www.example.com/page.html#http%3A%2F%2Fwww.example.com%2FanotherPage.html)
Obviously, you would have to have a script like this on every page that is to appear inside the iframe.
Once this is in place, then you can put this snippet inside of page.html, and it will make the iframe automatically load the url in the hash tag:
window.onload = function() {
var url = window.location.hash.substr(1);
if (url) {
document.getElementById('iframe').src = url;
}
}
I unfortunately haven't run this code to test it, but it is pretty straight forward and should explain the idea. Let me know how it goes!
You could add an onload event to the iframe and then monitor that - it'll get thrown whenever the frame finishes loading (though, of course, it could be the same URL again...)
Instead, can you add code to the frame's contents to have it raise an event to the container frame?
In IE, the "OnReadyStateChanged" event might give you what you want.

Categories