在Web應用程序中控制瀏覽器前進/後退功能

我正在編寫一個基於Web的應用程序，供我工作的業務內部使用。這是一個相當複雜的應用程序，有很多表單可以讓用戶查看和輸入數據，這些數據一旦保存就會存儲在數據庫中。在Web應用程序中控制瀏覽器前進/後退功能

我急於避免的一件事是允許存在用戶可能在瀏覽器中輸入大量數據然後（有意或無意）從頁面導航而不保存更改的情況。爲此，我已經實現了一個入口頁面，該頁面打開一個新的瀏覽器窗口，其中根本沒有導航控件;只有網頁上提供的內容。

不過，也有其中一個用戶仍然可能會丟失數據兩種可能的途徑：

瀏覽器關閉按鈕仍然處於啓用狀態，並且用戶可以通過點擊它無意中可能丟失工作。我可以忍受這一點，因爲它可以幫助用戶不要在腳下自我射擊，這是最終目的。
在Internet Explorer中（顯然，在Firefox中），Backspace按鈕的作用類似於後退按鈕。我只是意外地發現了這一點，並且一直未能找到一種簡單的方法來阻止這種行爲。這可能是一個問題，因爲無意中使用了Delete鍵（例如，將光標放置在只讀文本框中，或者當光標不在頁面中的任何特定字段上時）將從頁面上導航。

我想怎麼辦，作爲最低，爲防止Backspace鍵從瀏覽過的網頁，如果該網頁上有任何用戶可寫域和任意字段已經由用戶自改表單被加載。理想情況下，我想在用戶登錄到此Web應用程序時完全禁用Backspace鍵的這種特殊用法。爲了達到這個目的，我能想到的兩種可能的方式是：（1）在每個頁面加載時清除瀏覽器的歷史記錄，或（2）捕獲Backspace鍵並且只允許它在光標位於可以更改文本的字段（例如文本框）。

任何人都可以建議我如何能夠實現這些事情嗎？該解決方案需要程序化，而不是必須在公司的每個瀏覽器上手動配置。

來源

2011-03-08 David Hazel

如果其他人有必要解決這個問題，我發現了另一個網站，這裏的解決方案：http://mspeight.blogspot.com/2007/05/how-對禁用，退格鍵式-IE-and.html。從那裏的積極反應來看，這種「你的用戶在工作和家中的日常活動中學會期望的功能」並不是那種類型，對許多人來說都是一件令人討厭的事情。 – 2011-03-09 15:00:55

而不是阻止*功能，您的用戶已經學會在他們的日常活動在工作和家中期望，爲什麼不工作與它呢？讓「後退」按鈕實際上按照預期將它們帶到前一個屏幕，然後使用AJAX默默保存表單（比如每5秒或10秒），這樣當它們返回到表單時，您可以檢查看看他們是否已經保存了部分未提交的值並重新加載它們。

這種方法與基於網絡的應用程序和的實際情況一致，如果實施得好，用戶就會喜歡。一條警告稱「你做錯了什麼」只會讓用戶感到沮喪，並使他們更少信任你的應用程序。請記住 - 用戶幾乎從不做錯事。這是我們的應用程序不符合使用情況。

^{*更喜歡嘗試來阻止功能。正如您發現的那樣，設計互聯網和網頁瀏覽器的人從來沒有真正打算讓網站開發人員完全禁用在導航歷史記錄中前後移動。}

來源

2011-03-08 14:07:06

這樣的事情呢？你可以在他們離開之前問他們是否確定。

var changes = false;   
window.onbeforeunload = 
     function() 
     { 
      if (changes) 
      { 
       var message = "Are you sure you want to navigate away from this page?\n\nYou still have unsaved changes.\n\nPress OK to continue or Cancel to stay on the current page."; 
       if (confirm(message)) return true; 
       else return false; 
      } 
     }

來源

2011-03-08 14:07:31

每次回發完成時，onbeforeunload事件處理程序都不會啓動嗎？我不希望每次出現提示都會跳出當前頁面;只有當他們在試圖從頁面導航的上下文中使用Backspace鍵時。太多這樣的提示會導致用戶（a）厭倦他們，並且（b）習慣自動點擊「確定」。 – 2011-03-09 09:28:18

是的。提交表單之前，將更改值設置爲false。 – 2011-03-09 14:09:22

你應該看看Javascript的window.unload事件。

當用戶嘗試離開頁面時會觸發此操作。你不能完全阻止他們離開頁面，但你可以給他們一個取消的機會。

來源

2011-03-08 14:07:33 edeverett

-1

試試這個

window.onbeforeunload() { 
    return "Are you sure you want to navigate away?"; 
}

來源

2011-03-08 14:07:44 longhairedsi

在Web應用程序中控制瀏覽器前進/後退功能

回答

相關問題