74073

Prevent user to leave my page in js

Question:

In my form i have an unshow modal. I open the modal if the user click on my "leave image" and i ask if he want to leave.

Is that possible in JavaScript (Jquery ?) to "stop" the reloading or the page change to show my modal and continue the action (Reload, Next page, Prev page, etc...) if the user say yes ?

I tried:

$(window).bind('beforeunload', function(){ return 'message to show'; });

But i don't want to open the browser popup, i want mine ^^.

Answer1:

There is no way of stopping user from leaving the page. Only thing that can be done is confirm window.

Answer2:

There is both window.onbeforeunload and window.onunload, which are used differently depending on the browser. You can assing them either by setting the window properties to functions, or using the .addEventListener:

window.onbeforeunload = function(){ // Do something }

// OR

window.addEventListener("beforeunload", function(e){ // Do something }, false);

Usually, onbeforeunload is used if you need to stop the user from leaving the page (ex. the user is working on some unsaved data, so he/she should save before leaving). onunload isn't supported by Opera, as far as I know, but you could always set both.

Recommend

  • Vaadin JavaScript unload event listener not firing
  • alternative jquery library to triger beforeunload/unload event
  • Event to be triggered when leaving website or closes the browser
  • Execute some codes when closing an Asp.net page
  • jQuery Custom Radio Buttons not working as radio buttons
  • Index 1 is either negative or above rows count
  • Bootstrap Carousel Next/Prev not working
  • django server code not updating
  • Problem with Django using Apache2 (mod_wsgi), Occassionally is “unable to import from module” for no
  • Bootstrap (v3.3.4) glyphicons not displayed in IE when refresh page (F5)
  • Implementing “partial void” in VB
  • Sending HTML Form Data to Spring REST Web Service
  • Position: fixed nav does not stay fixed
  • why do I get the error when installing the gem 'pg'? [duplicate]
  • FileReader+canvas image loading problem
  • Why value captured by reference in lambda is broken? [duplicate]
  • TFS: Get latest causes slow project reloading
  • Sending data from AppleScript to FileMaker records
  • htaccess rewriting URLs with multiple forward slashes
  • what is the difference between the asp.net mvc application and asp.net web application
  • Display Images one by one with next and previous functionality
  • Web-crawler for facebook in python
  • What do the 'size' numbers mean in the windbg !heap output?
  • Calling of Constructors in a Java
  • Traverse Array and Display in markup
  • Transpose CSV data with awk (pivot transformation)
  • A cron job substitute?
  • KeystoneJS: Relationships in Admin UI not updating
  • AngularJs get employee from factory
  • Load html files in TinyMce
  • Why can't I rebase on to an ancestor of source changesets if on a different branch?
  • Change div Background jquery
  • Django query for large number of relationships
  • Why is Django giving me: 'first_name' is an invalid keyword argument for this function?
  • Binding checkboxes to object values in AngularJs
  • How can I use `wmic` in a Windows PE script?
  • Net Present Value in Excel for Grouped Recurring CF
  • How to push additional view controllers onto NavigationController but keep the TabBar?
  • jQuery Masonry / Isotope and fluid images: Momentary overlap on window resize
  • How to load view controller without button in storyboard?