保留表單字段和jQuery VAR值時，瀏覽器後退按鈕點擊

我有一個使用下面的平臺/技術編寫的Web項目：保留表單字段和jQuery VAR值時，瀏覽器後退按鈕點擊

ASP.NET and MVC5/C# 
.NET Framework 4.5.1 
jQuery 2.1.1 
jQuery UI 1.10.4

這個應用程序編寫爲跨瀏覽器兼容和響應。

該應用程序有幾個頁面，其中包含工程師用來輸入數值的許多複雜表單域。這些值是溫度，流體和氣流公差，散熱極限等。有許多下拉列表可以選擇輸入和輸出的測量單位（攝氏度/華氏度，米/英尺每秒和許多其他）。

選擇一個度量單位後，其關聯的表單字段值將被轉換，並且表單字段值將被相應地使用jQuery事件進行轉換/計算/更新。度量單位選擇被保存在該頁面上的jQuery全局變量中。

通常的程序流程是供用戶輸入其規格和首選UOM。一旦表格值被輸入/轉換，它們就使用HTTP POST提交。具有簡短細節的兼容產品列表以JSON格式從MVC控制器返回，並使用jQuery DataTable進行顯示。

然後，用戶可以選擇將導致導航到不同的MVC視圖顯示大量的細節與可選附件，定價和航運選項一起指定產品的產品之一，等等

客戶端已決定，他們當用戶點擊瀏覽器的後退/前進按鈕時，希望保留這些表單域的狀態。這對我來說似乎是一項艱鉅的任務。我知道使用ASP.NET會話變量，但我想問開發人員社區實現這種功能的優點/缺點，並推薦使用哪些方法。

來源

2015-01-20 rwkiii

Cookie可能更受歡迎，因爲它存儲在客戶端，可以通過javascript讀取/寫入。如果用戶使用後退按鈕，則服務器有可能再次被擊中，頁面只會從瀏覽器緩存中加載。但是，JavaScript仍然會執行並能夠爲這些字段提取Cookie值。 – Tommy 2015-01-20 18:38:20

@Tommy HTML5是否實現了保存表單數據的功能？並且由於ASP使用cookie來保存會話變量，這可能會起作用嗎？或者你是否建議在客戶端使用jQuery保存cookie？對不起，我從來沒有遇到過像這樣保存複雜表單數據的挑戰。 – rwkiii 2015-01-20 18:54:26

ASP使用cookie來存儲會話標識，而不是存儲在服務器內存中的會話值。至於HTML 5，他們可能有，但由於我的大多數應用程序仍需要支持IE8等傳統瀏覽器，所以我沒有太多使用這些新功能的經驗。順便說一下，您可以從客戶端和服務器端創建/編輯Cookie。客戶端無法直接訪問會話變量，因爲它們存儲在服務器上。 – Tommy 2015-01-20 18:59:27

這是一個使用瀏覽器sessionStorage的解決方案。

在您的形式通過調用 StoreFormValues($(#MyFormId"), "MyFormName")

當加載你的頁面檢查，如果網頁透過後退按鈕導航到，如果是恢復所有表單數據的提交按鈕（或事件）存儲所有的表格數據。

if (performance.navigation.type == 2) { // 2 means page was accessed by navigating into the history (Browser Back Button) 
    RestoreFormValues($("#MyFormId"), "MyFormName"); 
} 

function RestoreFormValues(form, name) { 
    form.find(':input:visible').not(':input[type=button], :input[type=submit], :input[type=reset]').each(function() { 
     var value = sessionStorage.getItem(name + $(this).prop('id')); 
     if (value) 
      $(this).val(value); 
    }); 
} 

function StoreFormValues(form, name) { 
    form.find(':input:visible').not(':input[type=button], :input[type=submit], :input[type=reset]').each(function() { 
     sessionStorage.setItem(name + $(this).prop('id'), value = $(this).val()); 
    }); 
}

MyFormName只是一個名稱，用於在會話存儲中唯一地加前綴字段名稱。

來源

2018-01-02 17:02:14 RitchieD

保留表單字段和jQuery VAR值時，瀏覽器後退按鈕點擊

回答

相關問題