Javascript detect when page goes - javascript

There is a way to detect when the page is being redirected?
Example, I put a timeout for X seconds and if the page wasn't redirected (the user still in the page) it will kill the timer except if the page is being redirect... because some redirections can be freeze (delay, lazy)... so it will re-program the timer instead of kill it...
the readystate will change if the page is on a redirect?
How to detect if the page is on a redirect using javascript?
Thanks

window.onbeforeunload = function(e) {
return 'Dialog text here.';
};
this function fires when the user is leaving the page, but it is very limited in what can be done in it. For example you cant fire an ajax call and wait for a return in this function.
Read more here
https://developer.mozilla.org/en-US/docs/Web/API/WindowEventHandlers/onbeforeunload

Related

is it possible to perform action through console every 5 seconds even when the page refreshes?

is it possible to call a function every 5 seconds in a page through console even if the page keeps refreshing?
I tried using setTimeout, but it calls the function only once and the page reloads after that and the setTimeout is no longer running
I want to trigger a button click every 5 seconds
document.getElementsByClassName("postmessage")[0].click()
which refreshes the page
Is there a way to achieve this?
You could consider the Greasemonkey or Tampermonkey browser add-on, or anything similar, to automatically execute a piece of JavaScript at each load of a page, which then could have a call to setInterval:
setInterval(function () {
document.getElementsByClassName("postmessage")[0].click();
}, 5000);
Use onload event of document body as below
document.body.addEventListener("load", function(){
document.getElementsByClassName("postmessage")[0].click()
});
This code will work event you refresh the page.
See document related to event Here

How to detect if browser is in the process of loading a new page

I have a web app with some 'safety' code which causes a page reload if the server (Socket.IO) connection goes silent for more than 5 seconds (generally customer site firewall/broken-proxy issues).
The Socket.IO connection stops as soon a new page starts loading, but the safety code doesn't see this. Navigating to a slow page causes the safety code to fire and jump you back to the previous page.
I need to be able to tell (just before this code causes a reload) whether the browser is currently waiting for a new (slow) page to load.
What approaches are there to doing this, other than putting a jQuery click event on every link (which would not catch navigation via the address bar)?
Thanks,
Chris.
Monitoring window.onbeforeunload would do the trick. Fires right after the user starts navigating away.
Try typing this in the Chrome Console on any page and click on any link:
window.onbeforeunload = function () { console.log("oh noes"); }
My recommendation: fix your code so that you don't reload the page when the socket disconnects. Problem solved.
Edit
I suppose you could simply set a variable such as isReloading when the page reloads. You'd need to monitor onbeforeunload as well, and check what happens first: disconnect or the unload event. If the disconnect happens first, you're getting disconnected. Trigger the isReloading flag and reload. In the onbeforeunload check whether the flag was set. Reverse the concept of checking whether a slow page is loading: check whether you are reloading.

window.onunload fires and then the user clicks stop

Here is the flow I am trying to figure out.
User hits my page.
User clicks a link and onbeforeunload and unload get fired. Here i am getting rid of href in some of my links.
The page now hangs for a little bit giving the user a chance to hit the stop button in the browser.
Since the page is still on the original page (not the new page that was requested and then stopped) the hrefs are still blank.
Is there any way of knowing if the user clicks a stop button and they are still on the same page?
The only way I can think off the top of my head is to put a setTimeout in the onbeforeunload or unload but I don't really like that because there are too many variables for it still being messed up.
What I ended up doing was this:
window.unload = function(){
var _href = $('selector').attr('href');
$('selector').attr('href', '');
setTimeout(function(){
$('selector').attr('href', _href);
}, 1500);
}

JavaScript body onunload not working

Hi I have the following code:
function redirect(){
window.location.href='logged_out_chat.php';
}
...in my header and the following body tag:
<body onunload="javascript:redirect();">
...when i try this on one laptop, it redirects as it is supposed to (when you click on any link), but on my other laptop, desktop and notebook it ignores the redirect and goes to any link you click on.
I have spent hours on this...all have the same browser. I was wondering if there is an alternative way i could redirect the user when they click on a link etc.
What do you expect would happen?
When I close your page in my browser you get to redirect me to a page of your liking?
This goes againts security and user control. You shouldn't be able to interfere with the page when I close it.
The morale is don't rely on onunload to do anything non-trivial.
When a window unloads it stops processing everything, that means ajax requests, pending downloads etc, most even freeze animated gifs. Some browsers support onbeforeunload, but I completely agree with #Raynos you can't count on the event, so using it is not a good design decision.
You can't hijack onunload and redirect the user. That would prevent the user from closing their browser, refreshing the page, or manually navigating to another site. If that's what you are trying to do, you are out of luck. All onunload is good for is asking the user if they are sure they want to leave the page.
If, however, you are trying to cause a clicked link to go to a different location, that's easy. To change the link permanently:
myLink.href = 'logged_out_chat.php';
If you want to change the links temporarily, add a click handler that you can later remove:
function goToLoggedOutChat(e)
{
e.preventDefault && e.preventDefault();
e.returnValue = false;
location.href = 'logged_out_chat.php';
}
mylink.onclick = goToLoggedOutChat;
To re-enable the link:
mylink.onclick = null;
To do it for every link on the page:
for (var i=0; i<document.links.length; i++)
{
document.links[i].onclick = goToLoggedOutChat;
}

How do I control the behavior of window.location in Javascript?

At the bottom of my page I have window.location = ...
I wish my page (let's call it jspage) to load, and then only once everything is fully loaded do the redirect. At the moment I get "stuck" on the referring page while jspage is processing, then jspage flashes up for a tiny instant and I am redirected
You can put your redirect to OnLoad handler of body, or use jQuery $(document).ready() to put your code in, or add timout and stay for some time on your jspage for better control of time when redirect happens.
But I'd start figuring out why you are "stuck" on referring page. It very well could be caused by slow server side processing of jspage rather than browser rendering (use Fiddler or Net tab of FireBug in Firefox to see when page actually comes back from server).
I would go with onload event of the window, and in there put small timer e.g. two seconds to ensure user will see the splash screen. Code for this would be simply:
<script type="text/javascript">
window.onload = function() {
window.setTimeout(function() {
document.location.href = "otherpage.html";
}, 2000);
}
</script>

Categories

Resources