jQuery - Display Confirm Dialogbox for Unsaved Change before Leaving the Page

By using window.onbeforeunload, here is the complete code:

  <script type="text/javascript">  
   var warningMessage = 'You have unsaved changes on this page.';  
   var changed= false;  
   $(document).ready(function () {  
     $('#saveButton').click(function () {  
       changed= false;  
     });  
     $('input:not(:button,:submit),textarea,select').live('change', function () {  
       changed= true;  
     });  
     window.onbeforeunload = function() {  
       if (changed ==true) return warningMessage ;  
     };  
   });  
 </script>