What I'm looking to do is create a new window using window.open and then when the new window opens, I want to check if that window is active throughout?
For example: I have
myNewWindow = window.open(document.getElementById("inputbox").value).focus();
Once this window opens, I want to increment the value of variable increase if myNewWindow loses focus.
I'm doing :
if(myNewWindow.onblur()){
increment value...
}
setTimeout('myNewWindow.close()',3000); // closing window after 3 seconds. So, I'm really trying to check if the window was in focus for those 3 seconds.
However, the onblur does not seem to work no matter what I try. but, window does close.
Any ideas anyone? I just need to find out if the new opened window was minimized or some out of focus.
Its fairly easy to detect if the window in which you are running your JS is losing focus or not. And the same does not seem to work in my case. For example: JavaScript / jQuery: Test if window has focus
From page1, no you cannot directly set or subscribe to events on page2. However, you can use something like window.postMessage to pass messages between them.
Related
I want to create a "popup window" that get focus each time the button is clicked. The function below executes fine from an onclick event but does not execute as expected when the parent page is refreshed and executed from an onload event.
here is my function:
function PopupDelete(delete_images)
{
var win = window.open('URL','PopupDelete','width=500,height=400,scrollbars=yes');
win.focus();
}
So if I use this from the button below it works as expected.
<input type="button" name="delete" value="Images" class="smallbutton" onclick="PopupDelete(delete_images);">
Now the problem I am having is we are using another method called set_mode on the button instead of directly calling the PopupDelete function.
function set_mode(mode)
{
document.MASTER.mode.value = mode;
document.MASTER.submit();
}
<input type="button" name="delete" value="Images" class="smallbutton" onclick="set_mode('delete');">
It sets the mode in the master form as Delete and submits the form. The landing page is the same page where the form is. So it does some php validation and executes the PopupDelete function with onload method within the body tag.
<body onload='PopupDelete(delete_images)'>
If there was no pop up window open it works fine but if the pop up window was already open and minimized, then the pop up window does not get the focus. The funny thing is it does recognized and updates the contents rendered on the pop up window but does not recognize the .focus().
Any suggestions will be widely appreciated.
Both opening a popup window without user interaction and focusing a popup window without user interaction is a problem is due to browser security. Also because security is maintained independently, this is browser specific.
It appears that you can open a popup window without user interaction if the user has already have accepted to show blocked popups. But allowing popups does not allow for calling the focus method on any popup window object. This other SO answer touches on this if you would like more information.
You can demo this problem with the following code. Loading the page does not allow for the popup to open in neither Safari, Chrome, or Firefox (keep in mind I'm on a mac so the browser results may be different for windows). If you allow the blocked popup, or already have the popup window open from previously visiting the site, then the window will be reloaded with the url in all 3 browsers. Only Safari allows calling the focus on this already popped up window without user interaction (onload), Chrome and Firefox do not. But as you can see clicking the focus button does still focus the popup window on all 3 browsers, showing that it is possible, but the browser is just blocking it. So from what I can tell this is only possible in Safari (once again keep in mind I have not tried IE). But either way I don't believe it would be good to force your users to use a specific browser to view your site correctly.
var w;
function PopupDelete(delete_images) {
w = window.open('/testing/t/', 'PopupDelete', 'width=500,height=400,scrollbars=yes');
console.log(w);
w.focus();
}
$(function () {
PopupDelete();
$('#open').click(PopupDelete);
$('#focus').click(function () {
console.log('f', w);
w.focus();
});
});
DEMO
Also keep in mind, even if you could do this, when you reloaded the parent it's reopening the popup window and replacing the previous one (and this has to be done because to my knowledge you can't get a window object of a previously opened window, there is no way to maintain that variable to focus it without reopening it first). So this popup window wouldn't keep it's integrity anyway. I believe there must be a better way to completing this task.
On the page load you can show this popup
$(document).ready(function () {
window.open("URL","Hello","width=500,height=500,scrollbars=yes")
});
I am trying to detect whether the current page is already opened in a different tab or not.
I tried using window.open(), but I get as return the current window itself, not the supposedly other window of same address. It will always return true.
So say, if 'mysite.com' is already opened, when the user opens a new window with 'mysite.com', I shall detect that, focus the other window and close the current one.
Would love to hear any ideas, or whether this is possible. I'm trying to capture all links into a single tab.
You can use localStorage events to communicate between different tabs and therefore detect if a page is already opened. Check this answer: https://stackoverflow.com/a/14792159/60745
Even when you're only concerned with a tab in the same browser on the same machine, the problem with trying to accomplish this through pure javascript is that although you could set a cookie on each of your sites pages (window.onload) to record the user has initially visited your site, there's no safe way to ensure you remove this cookie when they leave.
Although you have the onunload & onbeforeunload events, these are not fired when you leave a site over a link, uses a browsers back button or closes the browser.
I have an application containing a JavaScript view model controlling it.
The application launches a new window with (window.open()) and assigns click event listeners to buttons in the new window. New window contains a form, which when submitted, causes an unload event on its window, and thus breaking access to it from the parent window.
How can the parent's reference to this new window persist or reinstate, when the window 'unloads' and a form submits?
You can not keep that reference. However if you are trying to access some kind of values you may look into cookies or local storage.
You can also try to reinstate the reference by attaching an event listener to the "unload" event. When the event occurs close the current "parent" window, and make the "submit" script point to the parent window. Once opened you can re-open the child window from there.
Update
Cross-window javascript is a messy subject. I advise taking the first approach if it's applicable.
As far as I know, not all browsers allow to regain access to a window by name even if you provide it. But I'd still try to use distinct window names with window.open.
When trying to regain access to it - just do a window.open without url - maybe javascript:void(0) as address (so the window doesn't navigate away), it should be the same window as long as you use the same id.
it's pretty hacky though
I am opening pop-up window through JavaScript with resize option for end user. End user may resize pop-up window or change its default position by dragging it.
I have requirement of remembering last position and size of pop-up window when user closes the window.
At present I can keep last size of the pop-up window in onbeforeunload event using cookie. But still could not find last position of the window.
Am I missing something very obvious, or what I am doing is the correct way to do it.
The function window.open() returns a handler to the opened window.
var myWindow = window.open('some_url','some_name');
You could maybe then use the myWindow to obtain its position.
Make a try with window.screenLeft/window.screenTop on IE and window.screenX/window.screenY in other browsers to get the positon.
Hope this helps,
d.
Finally I used cookie solution to remember position of last open window.
Using javascript "window.close()" method after opening new window using "window.open", it serve the problem i.e. but it will ask a confirmation message to user whether he really wants to close the window or not... if user selects yes then the parent window will close and if not then he will remain on the same window and new window will not get open up..
So is there any way so that parent window will get closed without asking any confirmation message and new window will gets open up ?
No. It´s a security feature. You are trying to manipulate an application on another users machine.
If you put it in another context it becomes clear why it is as it is and why it should be that way: Would you like if your email client suddenly closed cause you read an email?
EDIT: What you can do is having the login window trigger a navigate event in it´s opener so the first page gets replaced by the billing info page. Then it can close itself.