i have this page which opens up a popup. i want to refresh the parent after popup has been closed.. i used the function i found in stackoverflow
var win = window.open("popup.html");
function doStuffOnUnload() {
alert("Unloaded!");
}
if (typeof win.attachEvent != "undefined") {
win.attachEvent("onunload", doStuffOnUnload);
}
else if (typeof win.addEventListener != "undefined") {
win.addEventListener("unload", doStuffOnUnload, false);
}
which didn't do anything after i closed the pop up... what can i do achieve this?
thanks...
You wrote the unload event in the wrong place. You added an unload event to the main page instead of to the popup...
var win = window.open("popup.html"); // O.K.
All of this should be in the popup.html page...
function doStuffOnUnload() {
alert("Unloaded!");
}
if (typeof win.attachEvent != "undefined") {
win.attachEvent("onunload", doStuffOnUnload);
} else if (typeof win.addEventListener != "undefined") {
win.addEventListener("unload", doStuffOnUnload, false);
}
You can use the unload jquery function:
$(window).unload(doStuffOnUnload);
unload docs
Related
I'm creating a game page with JavaScript.
I am currently registering the Visibility Change event listener to turn on/off the BGM, but if I close the screen in IOS, the application will no longer move.
So I commented out the Visibility Change event. On Android, the BGM continues to play when the screen is closed, but iOS stops playing even without a BGM OFF event.
I tried the pagehide event, but it doesn't seem to work.
var hidden, visibilityChange;
if (typeof document.hidden !== "undefined")
{
hidden = "hidden";
visibilityChange = "visibilitychange";
}
else if (typeof document.mozHidden !== "undefined")
{
hidden = "mozHidden";
visibilityChange = "mozvisibilitychange";
}
else if (typeof document.msHidden !== "undefined")
{
hidden = "msHidden";
visibilityChange = "msvisibilitychange";
}
else if (typeof document.webkitHidden !== "undefined")
{
hidden = "webkitHidden";
visibilityChange = "webkitvisibilitychange";
}
document.addEventListener(visibilityChange, SnlPixiMgr.VisibilityChange, false );
window.addEventListener("pageshow", function(evt){
alert('show');
}, false);
window.addEventListener("pagehide", function(evt){
alert('hide');
}, false);
arguments.callee.VisibilityChange = function()
{
console.log("VisibilityChange called");
if(document.hidden)
{
for( var i=0; i<SnlPixiMgr.m_HiddenEvent.length; i++ )
{
SnlPixiMgr.m_HiddenEvent[i]();
}
}
else
{
for( var i=0; i<SnlPixiMgr.m_VisibleEvent.length; i++ )
{
SnlPixiMgr.m_VisibleEvent[i]();
}
}
}
I want the BGM to be turned on and off properly when I turn the screen off and on in iOS.
I am trying to save some statistics when the user closes the browser, below is the code
if (typeof document.hidden !== 'undefined') { // Opera 12.10 and Firefox 18 and later support
hidden = 'hidden';
visibilityChange = 'visibilitychange';
} else if (typeof document.mozHidden !== 'undefined') {
hidden = 'mozHidden';
visibilityChange = 'mozvisibilitychange';
} else if (typeof document.msHidden !== "undefined") {
hidden = 'msHidden';
visibilityChange = 'msvisibilitychange';
} else if (typeof document.webkitHidden !== 'undefined') {
hidden = 'webkitHidden';
visibilityChange = 'webkitvisibilitychange';
} else {
console.log('in else condition');
}
if (typeof document.addEventListener === 'undefined' || hidden === undefined) {
console.log("App requires a browser, such as Google Chrome or Firefox, that supports the Page Visibility API.");
} else {
document.addEventListener(visibilityChange, handleVisibilityChange, false);
}
function handleVisibilityChange() {
// Send a ajax call with **async: false**
}
The above code works well in mozilla firefox, google chrome but does not in safari. I am testing this on Mac Os and safari version is Version 12.1.1 (14607.2.6.1.1)
Can any please suggest if this is an expected behaviour in safari and what could be done as a workaround.
Thanks.
According to the MDN docs, the "pagehide" event should work for this:
If you're specifically trying to detect page unload events, the pagehide event is the best option.
https://developer.mozilla.org/en-US/docs/Web/API/Window/pagehide_event
This is my code to make when click close button then save at localStorage to don't display again:
$('#myAlert .close').on('click', function() {
$('#myAlert').fadeOut(300);
if (typeof localStorage !== 'undefined') {
localStorage.setItem('alert-closed', true);
localStorage.removeItem("hidden");
}
});
The problem that I can't make it display only once, How can make this?
Rearrange if statements, check if localStorage is undefined, also if localStorage.getItem("alert-closed") is equal to null before attaching click event to element.
$(function() {
if (typeof localStorage !== undefined) {
if (localStorage.getItem("alert-cosed") === null) {
$('#myAlert .close').on('click', function() {
$('#myAlert').fadeOut(300);
localStorage.setItem('alert-closed', true);
localStorage.removeItem("hidden");
});
}
} else {
alert("`localStorage is `undefined`")
}
});
I am trying to run some code when the browser back button is clicked.
How can i found out browser's back button with out changing the browser history?
I tried the code below.
I got an exception in the else block saying: "event is not defined".
window.onunload = HandleBackFunctionality();
function HandleBackFunctionality()
{
if(window.event)
{
if(window.event.clientX < 40 && window.event.clientY < 0)
{
alert("Browser back button is clicked…");
} else {
alert("Browser refresh button is clicked…");
}
} else {
if(event.currentTarget.performance.navigation.type == 1)
{
alert("Browser refresh button is clicked…");
}
if(event.currentTarget.performance.navigation.type == 2)
{
alert("Browser back button is clicked…");
}
}
}
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.11.0/jquery.min.js"></script>
use
$(window).on("navigate", function (event, data) {
var direction = data.state.direction;
if (direction == 'back') {
// do something
}
if (direction == 'forward') {
// do something else
}
});
Okay. Besides the fact that you should not initially trigger the event and to .unload = FunctionName and not .unload=FunctionName() and that you need to pass the event-argument I checked the code in the browser.
currentTarget is empty - this totally makes sense as there is no event-target like onclick but it is just the site reloading/unloading.
Please debug the code by yourself by using this and fit it to your needs:
window.onunload = HandleBackFunctionality;
function HandleBackFunctionality(event)
{
console.log(event, window.event);
}
You will see that currentTarget is not set (while event is).
This is the only solution that works for me with IOS safari.
<script>
window.addEventListener( "pageshow", function ( event ) {
var pagehistory = event.persisted ||
( typeof window.performance != "undefined" &&
window.performance.navigation.type === 2 );
if ( pagehistory ) {
// back button event - Do whatever.
}
});
</script>
Requirement: A popup will be opened up from parent window, and it should get closed when the focus from the window is lost. (This should happen even when another application window is opened or came into focus).
Tried code:
<body onBlur='javascript:window.close();'>
Issue:
On click within the body of the popup makes the popup closed.
Compatibility: ie6 and above, firefox.
I got a workaround from http://pro-thoughts.blogspot.com/2006/10/incorrect-behavior-of-windowonblur.html
var active_element;
var bIsMSIE;
function initiateSelfClosing() {
if (navigator.appName == "Microsoft Internet Explorer") {
active_element = document.activeElement;
document.onfocusout = closeWnd;
bIsMSIE = true;
}
else { window.onblur = closeWnd; }
}
function closeWnd() {
if (window.opener != null) {
if (bIsMSIE && (active_element != document.activeElement)) {
active_element = document.activeElement;
}
else {
window.close();
}
}
}
<body onload="initiateSelfClosing()">
</body>
But here also one problem is there, if there is a print button in the page, and if am clicking on print > then cancelling the print job, the popup is getting closed.
Can some one help me pls...
Little corrections in sathishkumar's answer
1.we need to convert win to jquery object
2.Apply blur event on jqvariable and not on window
3.this.close is good enough in definition of onblur event
var win = window.open("URL");
var jqwin = $(win);
$(jqwin).blur(function() {
this.close();
});
Use document for blur event
var win = window.open("URL");
$(window).blur(function() {
win.close();
});
You cannot attach onblur event to BODY but
you Can attach a function on Onblur event of window.
<script type="text/javascript">
function closeme()
{
window.close();
}
window.onblur=closeme;
</script>
Since you have Edited your Question, You can get more help here