My webpage runs a javascript function when the page is loaded. However, I don't want the function to run if the user comes back to this page using the back button. How can I prevent this using javascript?
$(document).ready(function(){
// Do not run this function if the user has arrived here using the back button
RefreshThePage();
});
I'd have thought that using cookies is the easiest way to do this
I think studying the way Struts handles duplicate form submissions could help you.
Some links:
http://www.techfaq360.com/tutorial/multiclick.jsp
http://www.java-samples.com/showtutorial.php?tutorialid=582
http://www.xinotes.org/notes/note/369/
Track when user hits back button on the browser
There are multiple ways of doing it, though some will only work in certain browsers. One that I know off the top of my head is to embed a tiny near-invisible iframe on the page. When the user hits the back button the iframe is navigated back which you can detect and then update your page. Here is another solution.
You might also want to go view source on something like gmail and see how they do it.
Here's a library for the sort of thing you're looking for by the way
The event object offers you to get the key code. so basically you register an eventlistener onKeyDown. Use the received event. if the keycode matches the key you like continue with your function.
document getElementById('elementId').onKeyDown = checkKey();
function checkKey(event) {
if (event.keyCode === keyCode) then . . .
}
play around with alert(event.keyCode); to find the right one.
Related
I am creating my own simple stats to record which pages were read and for how long etc.
I then use an ajax call to record the info in a database, it's working using the window.ONBEFOREUNLOAD event, however this creates a database record for each page visited and instead I want to save the page stats to js variables and then only do 1 ajax call when the visitor finally leaves the site.
Is there a way of creating an event listener using pure javascript to detect when the user leaves the site, maybe by evaluation the body's click event ???
No.
It is not possible for a browser to provide such an event by default: the browser itself has no awareness of what encompasses an entire site, it's thus impossible for a browser to know when a user leaves a site.
It is easy implement a solution yourself in JavaScript. The implementation is easy, the solution is hard.
You need to consider how you can tell when a user leaves your site. How do you define exit points? Can you define exit points? This is a non-trivial problem. I am not certain a solution exists.
Method 1:
Try the onbeforeunload event: It is fired just before the page is unloaded
It also allows you to ask back if the user really wants to leave.
see this demo
alternatively, you can send out an ajax request when he leaves.
Method 2 :
`if(window.screenTop > 10000)
alert("Window is closed");
else
alert("Window stillOpen");`
Method 3 :
See this article.
The feature you are looking for is the onbeforeunload
sample code:
<script language="JavaScript">
window.onbeforeunload = confirmExit;
function confirmExit()
{
return "You have attempted to leave this page. If you have made any changes to the fields without clicking the Save button, your changes will be lost. Are you sure you want to exit this page?";
}
</script>
All information in this answer are found on StackOverflow.com
I'm creating an HTML and Javascript client for running in browser which talks to REST API. I'm using RouteMap to set my URLs. So I've kept a convention something like this
http://mysite.com/#/{ResourceName}/[edit|view|list]/[Id]/
I've set just one route and I'm grabbing these parameters in the function bounded to hashchange. Most of the things work fine. Just two issues and I'm stuck because of them.
If the user clicks on the same link twice, hashchange event doesn't fire. Yes, hash has not changed so obviously it won't fire. But there should be something which can be done and I'm missing that.
If I change something in the UI (like bring up new divs and hide some) for which I don't want to change the hash link, I loose that history and can't go back by clicking the back button properly.
Any help will be grateful.
For #1, you probably want to attach a handler to the link click event. That way you can tell if the link is being clicked. When I use onhashchange, I always attach something to the click event to assist polyfills for onhashchange, so at least I can tell when it's failing.
For #2, I want to point out that having automatic stuff change the user's history is problematic. You could fill someone's history with minute, meaningless hash changes. I recommend only changing the history when the user actually interacts. Short of that, HTML5 does offer pushState and popState. Reference
I'm creating a homepage. The content of the page is only get by HTTP-Request. So that the Client never change the page-url. How can I catch the back() function from the Browser to go one step back in my HTTP-Request. The automaticly creating of History of all loaded HTTP-Request is done, maybe I must catch this back() function.
Thanks for Help
You might want to update the hash (www.mysite.com/#hash) and then use a mechanism to detect hash change.
Try using this: Browser Back Button Detection
As far as I'm aware you cannot interfere with the back button etc. as it affects the browsers UX.
The best way would probably be to catch the browsers 'onunload' event which is triggered when the page is left. You could write a custom handler function on the assumption that they are clicking back.
If you want to get the page the user come from, you can use the document.referrer (more info on getting last page URL from history object - cross browser?).
Then you could use this to create a link if needed.
Regards,
Max
I'm currently struggling with a good navigation on a website using Ajax calls and unobstrusive JS. I'm catching the click event on links, load the content, attach it to a div and then return false. This works quite well and also allows Google to crawl the site with speaky URLs.
But I didn't know how to deal with the browser back button. I found this solution to catch the event when the user clicks on the back button:
http://www.bajb.net/2010/02/browser-back-button-detection/
It works quite well. But I also want the back button to work normally when the user found the website via a link and wants to return to the previous page (I don't want to trap anyone).
When I thought about it the best way would be to use anchors. The normal back button supports them and you can go back in history without reloading the page (/#1 <- /#2 <- /#3 etc.)
It would work like this:
Use normal URLs in the link, but catch the click event
When user clicks, load content and attach it to a DIV
Change the window.location, using an anchor (e.g. 'domain.com/#products/women-clothing' with window.location="#products/women-clothing";)
When the window.location changes, get the anchor, read out the path and get the content via ajax, attach it to a DIV
Only the last part isn't really clear for me and I could need help here.
Finaly, my question: Does this make any sense?
Thanks!
Just add the href to window.location.hash after loading the content into a div. Then you can use that back button detection script to load what ever is in the hash.
I solved the problem by using this great jQuery Plugin: History.js
Thanks!
I'm trying to detect if a user pressed the left mouse button or right button + ctrl key, but I'm not sure how to do this.
I know do just detect a click, I could use
<li onClick=\"dosomething()\">
Is there a function to do
<li onLeftClick=\"dosomething()\"> ?
With jQuery one could do something like
$(document).click(function(e) {
if (e.button == 0) {
// was the left button
alert('clicked');
}
});
And with normal javascript there should be some kind of event variable accessible in an onClick function
Perhaps this'll also help yet I don't know if its still accurate
http://www.javascripter.net/faq/leftvsri.htm
You can check the button property of the event.
What you are definitely not going to like is that different browsers return different values: check out the documentation for Firefox and IE. So you will also need to do a browser detect of some sort.
You're looking on the wrong side of things. PHP is server-side, meaning it runs on the servers as opposed to the people visiting your site. When someone visits your site, the visitor (a client) sends the server computer a request for a page. The server receives that request and sends the client the information. When a client clicks his/her mouse, though, nothing is (by default) sent to the server.
The solution depends on what you need to do. If you need PHP scripts to run when you click something, look into sending asynchronous requests through AJAX. You can put your AJAX calls into the dosomething() function. http://www.ibm.com/developerworks/web/library/wa-ajaxintro1.html is a good place to start. If you're familiar with jQuery, though, it's a very simple function call: http://api.jquery.com/jQuery.ajax/