有的時候,我們必須要在離開頁面之前檢查 From 是否有被改變而提出警告,這個時候以下的 Code 就非常的好用
原理就是將 Form 內的所有值 Hash 起來
然後在頁面離開之前檢查是否 Hash 改變而提醒用戶
(function ($) { $.fn.watchChanges = function () { return this.each(function () { $.data(this, 'formHash', $(this).serialize()); }); }; $.fn.hasChanged = function () { var hasChanged = false; this.each(function () { var formHash = $.data(this, 'formHash'); if (formHash != null && formHash !== $(this).serialize()) { hasChanged = true; return false; } }); return hasChanged; }; }).call(this, jQuery);
使用方式:
jQuery(function ($) { var $form = $('form').watchChanges(); $(window).on('beforeunload', function() { if ($form.hasChanged() and ! confirm('Continue without saving changes?')) { return "是否確定離開"; } }); });