What is the difference between window.focus() and window.blur()? - javascript

I'm new learner of JavaScript...I couldn't find out the difference between window.focus(); and window.blur();.
<!DOCTYPE html>
<html>
<body>
<button onclick="focus()">Click</button>
<script>
function focus() {
var myWindow = window.open("", "", "width=200,height=100");
myWindow.document.write("<p>A new window!</p>");
myWindow.focus();
}
</script>
</body>
When I am using them I cant find out any action on window by them....
Help me to find out the use of them ...:)

They are basically opposite:
window.focus Assure that the new window GETS focus (send the new window to the front).
window.blur Assure that the new window does NOT get focus (send the new window to the background).
Examples:
-window.focus():
var myWindow = window.open("", "", "width=200, height=100"); // Opens a new window
myWindow.document.write("<p>A new window!</p>"); // Some text in the new window
myWindow.focus(); // Assures that the new window gets focus
-window.blur():
var myWindow = window.open("", "", "width=200, height=100"); // Opens a new window
myWindow.document.write("<p>A new window!</p>"); // Some text in the new window
myWindow.blur(); // Assures that the new window does NOT get focus

you can use chrome console to run this code
1.var myWindow = window.open("http://www.runoob.com","newwindow", "width=200,height=100");
2.myWindow.focus();
3.myWindow.blur();
after run this three line code you can understand what's the difference between window.focus() and window.blur()

I got answer...This code is very useful to know the actions by both of them..
var focus = true;
window.onblur = function() { focus = true; document.title="NEW MESSAGE";}
window.onfocus = function() { focus = true; document.title="Talk"; }
document.onblur = window.onblur;
document.focus = window.focus;
function msg(){
window.open("https://www.google.co.in/?gfe_rd=cr&ei=luC_V_v_C8aAoAP-7ofwDA")
if(focus) {
document.title="Talk";
} else {
document.title="NEW MESSAGE";
}
}
msg();`
I got answer from the following link
refer following link

Related

Call JavaScript function within document.write()

I am trying to call openswf function when i click on SWF part1 links which is in document.write(), but my problem is when i clicked on SWF part1 links it nothing happen.
This is my code.
<html>
show popup
<script>
function openswf(){
console.log("Do something")
}
function Popup()
{
var win = window.open('', '',"toolbar=no, width=1000, height=800");
var doc = win.document.open();
doc.write('SWF part1');
doc.close();
}
</script>
</html>
First i click on show popup links to call Popup() function and open new popup window which is work properly and then i want to click on SWF part1 links in that popup but it not working.
openswf is not defined in the popup window, but in the main window. But you can reference the main window with opener. I suppose you want to close the popup window when the user clicks:
doc.write('SWF part1');
It's probably calling the default <a> onClick event.
You have to preventDefault().
function Popup(event)
{
event.preventDefault();
var win = window.open('', '',"toolbar=no, width=1000, height=800");
var doc = win.document.open();
doc.write('SWF part1');
doc.close();
}
Let me know if it helps.
For starters, the variable "path" is not being passed to your new window. Use this instead...
function Popup(path)
{
var win = window.open('', '',"toolbar=no, width=1000, height=800");
var doc = win.document.open();
doc.write('SWF part1');
doc.close();
}

window.open returns null on iOS safari events: pagehide, unload and beforeunload

I'm trying to get a popup window to fire when a user navigates away from the current URL.
window.open seems to return null on safari iOS only, every other browser (desktop and mobile) seems to work fine given that a popup blocker isn't active.
Is this a known issue? If so are there any work arounds to getting a popup window on either the pagehide, unload or beforeunload event?
window.addEventListener('pagehide', function () {
// window.open("https://www.google.com", "_blank", "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");
var myWindow = window.open("", "");
myWindow.document.body.innerHTML = "pagehide";
});
window.addEventListener('unload', function () {
// window.open("https://www.google.com", "_blank", "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");
var myWindow = window.open("", "");
myWindow.document.body.innerHTML = "unload";
});
window.addEventListener('beforeunload', function () {
// window.open("https://www.google.com", "_blank", "toolbar=yes,scrollbars=yes,resizable=yes,top=500,left=500,width=400,height=400");
var myWindow = window.open("", "");
myWindow.document.body.innerHTML = "beforeunload";
});
I created a simple fiddle here:
https://jsfiddle.net/ovidubs/2cdas6vj/

Pop Up Blocker in Chrome and IE

Below is the piece of code I am using to open a link in a new window say "abc".
If the user again clicks on the same link, it should close and reopen the link in the same window "abc".
window.openOrFocus = function(url, "abc") {
if (!window.popups) {
window.popups = {};}
if (window.popups["abc"]){
var v=window.open("", "abc");
v.close();}
window.popups["abc"] = window.open(url, "abc");
}
But Now, say I click on the link, it opens the URL in a new window named "abc".
Now I go and close the window "abc". and go back and again click on the link.
That time it shows up the pop up blocker.
I am confused as to why this pop up blocker is coming when the I go and manually close the window and try to reopen by clicking on the link.
Happens both in IE as well as Chrome
Probably because you're calling window.open with a blank URL or repeatedly in that case.
You don't need your window.open("", "abc") call; instead, just use the window reference you already have:
window.openOrFocus = function(url, windowName) {
if (!window.popups) {
window.popups = {};
}
if (window.popups[windowName]){
window.popups[windowName].close();
}
window.popups[windowName] = window.open(url, windowName);
};
I would also listen for the unload event so you can remove your reference:
window.openOrFocus = function(url, windowName) {
if (!window.popups) {
window.popups = {};
}
if (window.popups[windowName]){
window.popups[windowName].close();
}
window.popups[windowName] = window.open(url, windowName);
window.popups[windowName].onunload = function() {
delete window.popups[windowName];
};
};
Side note: This is a syntax error:
window.openOrFocus = function(url, "abc") {
// --------------------------------^
I've replaced it with windowName in the code above.

Prevent parent window refresh during window.open() IE8

I want to submit the form data into the pop up window.
function doPopUp(link) {
var goAction = link;
var form = document.forms[0];
form.target = "newWin";
form.action = link;
var scrWidth = screen.availWidth - 20;
var scrHeight = screen.availHeight - 70;
var myWindow = window.open("", "newWin", "width="+scrWidth+", height="+scrHeight+", scrollbars=1, toolbar=0, menubar=0");
myWindow.location = goAction;
// if (window.focus) {
// myWindow.focus();
// }
form.submit(); // My guess is this line
}
When I use doPopUp(link) in the HTML button, I am successfully submit the form data into the new window and the parent window does not direct to the action url. This happen when I use Chrome and Mozilla.
But when I use IE8, the parent window also refreshed. I'm not sure how to tweak my code, as far as I understand, it has something to do the line form.submit().
How can prevent the parent window directed to the action url?

Javascript detect popup window close

I have this code in my popup window (which is opened by parent window):
window.onbeforeunload = closeWindow;
function closeWindow(){
}
The problem is that this code fires when parent window is being refreshed. Is there a way for this code only to fire when popup window is actually being closed?
Hmmm. You could try something like this in the window that opens the popup.
var NewWin = window.open("NewWin", "example.htm", "width=100;height=300;");
// modify styling as necessary etc.
NewWin.onbeforeunload = function() {
window.setTimeout(function() {
if (!NewWin) {
// window has been closed
} else {
// false alarm, just a refresh
}
}, 1000);
}
EDIT: To prevent the window from reopening on parent page refresh, use a similar technique from within the popup
window.opener.onload = function() {
window.opener.NewWin = self;
}
Then change the first line of the code above to:
document.onload = function() {
if (!NewWin) { var NewWin = window.open("NewWin", "example.htm", "width=100;height=300;"); }
}

Categories

Resources