jQuery Plugin To Detect Back Button Click In Browser - backDetect

backDetect is a jQuery plugin used to detect and fire a callback function when the user clicks on the back button in the browser. Useful to display a confirmation dialog when the users are about to leave the current webpage.

See also:

• jQuery Plugin For Confirmation on Leaving the Current Page - confirmExit
• Smart jQuery Plugin For Page Leave Event - pageleave
• Lightweight Exit Modal Plugin With jQuery And Bootstrap - exit-modal
• jQuery Plugin For Smart Exit Pop Behaviour - Exit Popup
• jQuery Plugin To Pop To Another URL On Page Exit - Exitpop
• Cookie-enabled Exit Popup Window Plugin With jQuery - ysExitPopup

How to use it:

1. Include the jQuery backDetect plugin after jQuery library.

<script src="//code.jquery.com/jquery-1.12.1.min.js"></script>
<script src="jquery.backDetect.js"></script>

2. It's a very simple and straightforward plugin, just call on it in the following way. It can be attached onto any DOM element at either document.ready or window.load, but I would recommend attaching this function to the body at window.load in the following fassion:

$(window).load(function(){
  $('body').backDetect(function(){
    alert("Look forward to the future, not the past!");
  });
});

3. You can also set a delay to the back detect like this:

$(window).load(function(){
  $('body').backDetect(function(){
      // Callback function
  });
}, 1000); // <- 1 second delay

4. Integrate the plugin with Bootstrap modal.

$(window).load(function(){
  $('body').backDetect(function(){
    $('#myModal').modal('show')
  });
});

Change log:

2018-01-16

• JS update & improvement

2016-11-14

• removed the need for the 1x1.png image for IE

---

This awesome jQuery plugin is developed by ianrogren. For more Advanced Usages, please check the demo page or visit the official website.