• 0

[JavaScript] onbeforeunload with exception


Question

I am working on a site that places orders and mgmt wants an alert when the user attempts to leave the site so that they don't lose their order. So of course the base answer is to use the "onbeforeunload" function. This is fine, except that there are "a href" tags that call JavaScript functions on the page (no way around this) So what I'm attempting to do is to find a way around. I have a variable (mbBeforeUnload) that is set when an item has been added to the order. But other than that I have not been able to find a way around this issue.

Code:

window.onbeforeunload = checkBeforeUnload;

function checkBeforeUnload(){

if (mbBeforeUnload){

return "The order will be lost if you navigate away from this page.";

}

}

Any thoughts?

10 answers to this question

Recommended Posts

  • 0

you are defining checkBeforeUnload after calling it...

chk out this example:

<HTML>
<head>
<script>
function closeIt()
{
  return "Any string value here forces a dialog box to \n" + 
		 "appear before closing the window.";
}
window.onbeforeunload = closeIt;
</script>
</head>
<body>
  <a href="http://www.microsoft.com">Click to navigate to 
	  www.microsoft.com</a>;
&lt;/body&gt;
&lt;/html&gt;

  • 0

Thanks, but that's not it at all. The function works as it should, I would like to be able to avoid triggering the call in specific cases. The "onbeforeunload" function is called for any <a> link and I have a few links that are just JavaScript calls.

The code below is simply lines taken out of context to show everyone what is being done. The variable "mbBeforeUnload" is set to true when any item is added to the order. So when the user selects a link after an item has been added the variable is true and the call is made. I have tried to temporarily reset the variable in the called function such as:

function test():{

mbBeforeUnload=false;

//do some other code

mbBeforeUnload=true;

}

But this still causes onbeforeunload to fire.

Thanks kindly nihal for the input. Any other ideas? Anyone?

  • 0

Yes I am calling a function using the "onclick"

Code:

<a href="java script:void(0)" onclick="ShowReviewSubmit();">3. Review & Submit</a>

So by this time the user has added one or more items and they want to review before accepting the order. All that does is hide and show some divs.

Thanks again for the feedback. If you're ever in the VB world and need help, feel free to ask. I've used that for 16 years, but JavaScript is new to me.

  • 0

Try this:

&lt;html&gt;
&lt;head&gt;
&lt;script&gt;
var preventPrompt = false;

function closeIt() {
  if(needsPrompt) {
	return "You sure?";
  }
  preventPrompt = false;
}
window.onbeforeunload = closeIt;
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;
  &lt;a href="http://www.google.com" onclick="preventPrompt=true;"&gt;A link that will be allowed regardless.&lt;/a&gt;
&lt;/body&gt;
&lt;/html&gt;

We're using the onclick event to set a variable. This variable is checked in the closeIt() method to see whether we should allow the request to go through unhindered. Regardless of the outcome, we then set this variable to false again, so other browser actions will be intercepted.

  • 0

Rob,

Thanks but I'm using the onclick to run a javascript function. There is no real href.

&lt;a href="java script:void(0)" onclick="ShowReviewSubmit();"&gt;3. Review &amp; Submit&lt;/a&gt;

The first post mentions that I already use a variable "mbBeforeUnload" so that the unload only activates if the user has added items to the order. But unfortunatly the "window.onbeforeunload" function is activated on any a href, even if there is no url. (arg) I have tried resetting the variable in the called function such as:

function test():{
mbBeforeUnload=false;
//do some other code
mbBeforeUnload=true;
}

But that doesn't work. (double arg) So again, thanks kindly, but I need a diff answer.

Have a great long weekend (if you're here in the US, if not, well, ditch work/school, have some fun!)

  • 0

&lt;html&gt;
&lt;head&gt;
&lt;script&gt;
var preventPrompt = false;
var careAboutPrompting = true;

function closeIt() {
  if(!preventPrompt &amp;&amp; careAboutPrompting) {
	return "You sure?";
  }
  preventPrompt = false;
}

function specialEvent() {
  alert("Our special event has been called, without triggering the closeIt() method.");
  return false;
}

window.onbeforeunload = closeIt;
&lt;/script&gt;
&lt;/head&gt;
&lt;body&gt;

&lt;a href="#" onclick="preventPrompt=true;specialEvent();"&gt;Do something special.&lt;/a&gt;
&lt;/body&gt;
&lt;/html&gt;

This really seems to do what you're asking unless I'm really mistaken. The careAboutPrompting variable in this example is basically akin to your mbBeforeUnload variable, set to true when you actually give a damn about the user possibly navigating away. The 'Do Something Special' link calls a JavaScript event, but the beforeunload event isn't acted upon.

Edited by Rob
This topic is now closed to further replies.
  • Recently Browsing   0 members

    • No registered users viewing this page.
  • Posts

    • Use this popular dating app? Hackers may have leaked your name, ID, and private photos by David Uzondu Image via Tea A dating app has been going viral lately (you have probably seen it on X), it's called "Tea," and it lets women anonymously post pictures of men to share dating "red flags." The app's marketing claims this is all for "safety," and you can see it on the company's website, where it states its mission is "to create a safer dating environment for women." In case you're confused and need a visual explanation, the following image pretty much sums it up (click to enlarge): Image: Tea's Website Tea has been around since 2023, but the surrounding controversy helped its recent rise to the top of the app charts. Now the platform has suffered its first notable breach courtesy of users from 4chan. This breach stemmed from a classic, sloppy development mistake. The Tea developers left a backend database wide open on Google's Firebase platform. Firebase allows for quick development, but its default security settings can be disastrously permissive if they are not locked down before an app goes live. Data in Firebase is stored in things called "buckets," which are just cloud storage folders. The leaked bucket in Tea's case contained the exact verification data the app requires from its users: selfies and ID photos, which it needs to confirm that users are women. It did not take long for users on 4chan to find this open door and walk right in. One user claimed, "Yes, if you sent Tea App your face and driver's license, they doxxed you publicly!" Another user claimed they downloaded as many as 3000 images before they got rate-limited by the server. Image: 404Media They described the trove of personal information as being "raw and uncensored." As per the Terms of Use (via 404Media) before you sign up for Tea, apart from selfie and ID photos, you are required to submit your location and birth date. All of this was reportedly accessible. 404 Media says that for a while, anyone with the right URL could view a list of user files. That page has since been locked down and now returns a "Permission denied" error, likely because the developers finally became aware of the leak. Tea has stellar reviews on both the Play Store and the App Store from users who see it as a more secure version of the "Are We Dating the Same Guy?" Facebook groups.
    • I always use O&O tools, it's a German software company and they release bunch of cool free tools like O&O Shutup to disable Windows crap or O&O AppBuster that allows you to remove apps that Windows doesn't allow to remove. Really good and reliable tools.
    • Ergh all the additional admin crap is gonna kill smaller UK forums All to please the religious puritans that are too illiterate to set up parental controls
    • I assume all the UK readers here are using a VPN now? Seriously who the hell is submitting their ID or doing a face scan to watch porn?
  • Recent Achievements

    • First Post
      Electronic Person earned a badge
      First Post
    • Week One Done
      CyberCeps666 earned a badge
      Week One Done
    • Very Popular
      d4l3d earned a badge
      Very Popular
    • Dedicated
      Stephen Leibowitz earned a badge
      Dedicated
    • Dedicated
      Snake Doc earned a badge
      Dedicated
  • Popular Contributors

    1. 1
      +primortal
      604
    2. 2
      ATLien_0
      234
    3. 3
      Xenon
      159
    4. 4
      neufuse
      131
    5. 5
      +FloatingFatMan
      124
  • Tell a friend

    Love Neowin? Tell a friend!