hosted by liquidweb


Go Back   Web Hosting Talk : Web Hosting Main Forums : Programming Discussion : window.onbeforeunload cross-browser functionality (jQuery)
Reply

Forum Jump

window.onbeforeunload cross-browser functionality (jQuery)

Reply Post New Thread In Programming Discussion Subscription
 
Send news tip View All Posts Thread Tools Search this Thread Display Modes
  #1  
Old 02-16-2010, 10:46 AM
mattle mattle is offline
Web Hosting Master
 
Join Date: May 2009
Posts: 766

window.onbeforeunload cross-browser functionality (jQuery)


Hi all,

So, I'm trying to negotiate overriding a window.onbeforeunload event.

I've got a header page that includes some basic JS for the whole site, including this bit:

Code:
$(document).ready(function ()
{
  $("#loading").hide("fast");
  $(window).bind('beforeunload', function () { $("#loading").show("fast"); });

  if (typeof pagestart == 'function') pagestart();
});
So, basically, <div id="loading"/> is a div that's also included in the header that has a nice little spinning graphic, and is z-indexed to make all other page elements unclickable before the page finishes loading. When you first click away from a page, I pop it up and once your destination finishes loading, it goes away. That part works great.

pagestart() is just a method that I use on individual pages to initialize any handlers, etc. that are page-specific.

So, now I've got a page that checks for changes in a form and needs to pop up a confirmation dialog if the user attempts to navigate away with unsaved changes. This means that the loading div will pop up, but if they click "Cancel," obviously, we need it to go away again. Alternatively, if we just overwrite the onbeforeunload event so that the loading div does not appear until the next page starts rendering, that would be fine as well.

This does not work at all:

Code:
function pagestart()
{
  $(window).unbind('beforeunload');
  $(window).bind('beforeunload', function ()
  {
    if (changed)
    {
      return "You have unsaved changes on this page.  Leaving the page\n" +
             "will result in the loss of these changes.";
    }
  });
}
The onBeforeUnload event doesn't fire at all, for some reason. If I set it explicitly:

Code:
window.onbeforeunload = function ()
{
  if (changed)
  {
    $("#loading").hide("fast");
    return "You have unsaved changes on this page.  Leaving the page\n" +
           "will result in the loss of these changes.";
  }
}
This works exactly as I'd expect in Firefox, however, in IE (7), the confirmation dialog is displayed and behaves as expected, but the "loading" div never goes away.

Reply With Quote


Sponsored Links
  #2  
Old 02-18-2010, 05:53 PM
mattle mattle is offline
Web Hosting Master
 
Join Date: May 2009
Posts: 766
window.onbeforeunload cross-browser functionality (jQuery) [SOLVED]

Fix was:

Code:
$(window).unload(function() 
{
  //...
});
jQuery seems to actually bind that to beforeunload...

Reply With Quote
  #3  
Old 03-07-2012, 03:37 AM
Nigel1111 Nigel1111 is offline
New Member
 
Join Date: Mar 2012
Posts: 3
cross-browser?

Quote:
Originally Posted by mattle View Post
Fix was:

Code:
$(window).unload(function() 
{
  //...
});
jQuery seems to actually bind that to beforeunload...
How is that cross browser? Chrome doesn't seem to give a fig about it.

Reply With Quote
Sponsored Links
Reply

Similar Threads
Thread Thread Starter Forum Replies Last Post
Site altered the size of my browser window! grandad Computers and Peripherals 5 10-20-2006 04:47 PM
Push PDF to browser ranther than open in browser window SimonT Programming Discussion 2 11-12-2005 10:43 AM
no white between image and browser window, how? macfan Web Design and Content 19 06-21-2004 01:11 PM
Control Browser Window Size djack89 Programming Discussion 5 11-29-2003 03:52 AM
controlling browser window on load djack89 Programming Discussion 2 06-19-2003 11:50 PM

Related posts from TheWhir.com
Title Type Date Posted
Open-Xchange Launches File Sync Service, Announces Online Communications Service Web Hosting News 2014-02-19 11:58:46
The Pirate Bay Helps Users Circumvent Censorship with New PirateBrowser Web Hosting News 2013-08-12 14:23:13
Emerging Tech - HTML5 Blog 2013-05-29 10:54:46
FireHost Report Shows Cross-Site Scripting Attacks Up 160 Percent from Q3 Web Hosting News 2013-01-30 14:43:57
FireHost Report Finds Cross-Site Attacks Trump SQL Injections in Q3 2012 Web Hosting News 2012-10-23 09:18:51


Thread Tools Search this Thread
Search this Thread:

Advanced Search
Display Modes
Postbit Selector

Posting Rules
You may not post new threads
You may not post replies
You may not post attachments
You may not edit your posts

BB code is On
Smilies are On
[IMG] code is Off
HTML code is Off

Forum Jump
Login:
Log in with your username and password
Username:
Password:



Forgot Password?
Advertisement:
Web Hosting News:



 

X

Welcome to WebHostingTalk.com

Create your username to jump into the discussion!

WebHostingTalk.com is the largest, most influentual web hosting community on the Internet. Join us by filling in the form below.


(4 digit year)

Already a member?