ASP.NET MVC，IE 11，$（document）.ready和back導航緩存

Question

IE 11有一個功能似乎打破我的代碼Back navigation caching。

當然，我的代碼在谷歌瀏覽器中工作得很好。

我有一個MVC應用程序和一個簡單的腳本來加載部分頁面來填寫一個div。這是我的HomeController類。

$(document).ready(function() { 
     // load the stats partial view 
     $('#stats_div').load('/Home/Stats'); 
    }); 

當我的頁面第一次加載，或者當我刷新頁面時，我的代碼被調用，我的div被正確地填充了我的部分頁面。

在我的網頁的另一部分，我有一個看起來像這樣幾個環節：

<li><a href="/Home/SelectVersion?version=1.0">1.0</a></li> 

這些鏈接是沒有做很多的事情，現在除了重定向到我的HomeController像索引操作這：

public ActionResult SelectVersion(string version) 
{ 
    // do some stuff 

    return RedirectToAction("Index"); 
} 

每當這些鏈接被點擊，瀏覽器重新加載頁面。但在IE11中，我的$（document）.ready腳本未被調用。

同樣，這在Chrome中運行得很好。

我所追求的是當按下SelectVersion鏈接之一時，我需要重新加載統計數據部分頁面。

我錯過了一些明顯的東西嗎？我做錯了嗎？或者是IE11只是搞亂了我。

正如上面的返回導航緩存鏈接中所建議的，我嘗試了以下嘗試並防止此行爲。

我添加了一個window.onbeforeunload事件沒有效果：

// does not help 
window.onbeforeunload = function() { 
} 

我添加代碼給此函數和它被每一次調用。

我也嘗試加載在window.onpageshow數據和它的表現一樣$（文件）。就緒：

// behaves the same as $(document).ready 
window.onpageshow = function (e) { 
    // load the stats partial view 
    $('#stats_div').load('/Home/Stats'); 
} 

換句話說，我不能得到這個工作。有其他人嗎？

示例代碼

下面介紹如何使用Visual Studio 2013中，Windows 8.1和IE 11

創建一個新的MVC應用程序，所有默認設置，沒有什麼特別的重現此。

這種替換Index.cshtml的內容：

<div class="row"> 
    <div class="col-md-6"> 
     <ul> 
      <li><a href="@Url.Action("SelectVersion", new { version = "All" })">All Versions</a></li> 
      <li><a href="@Url.Action("SelectVersion", new { version = "1.0" })">1.0</a></li> 
      <li><a href="@Url.Action("SelectVersion", new { version = "2.0" })">2.0</a></li> 
      <li><a href="@Url.Action("SelectVersion", new { version = "3.0" })">3.0</a></li> 
     </ul> 
    </div> 
    <div class="col-md-6" id="stats_div"> 
     <div class="panel panel-default"> 
      <div class="panel-heading"> 
       <h3 class="panel-title">Overview</h3> 
      </div> 
      <div class="panel-body"> 
       <div class="col-md-12"> 
        Choose a Version... 
       </div> 
      </div> 
     </div> 
    </div> 
</div> 

@section scripts 
{ 
    <!--Load the AJAX API--> 
    <script type="text/javascript" src="https://www.google.com/jsapi"></script> 

    <!--Script to render the charts--> 
    <script type="text/javascript"> 

     // this function is called when the page is loaded and it is safe to access elements with jQuery 
     $(document).ready(function() { 
      // load the stats partial view 
      $('#stats_div').load('/Home/Stats'); 
     }); 

    </script> 
} 

修改HomeController.cs有以下方法：

public class HomeController : Controller 
{ 
    public ActionResult Index() 
    { 
     return View(); 
    } 

    public PartialViewResult Stats() 
    { 
     ViewBag.VersionName = Session["VersionName"] ?? "Click on a Version"; 
     return PartialView("_Stats"); 
    } 

    public ActionResult SelectVersion(string version) 
    { 
     Session["VersionName"] = version; 
     return RedirectToAction("Index"); 
    } 
} 

添加一個名爲_Stats文件。CSHTML與此內容的意見/ Home文件夾：

<div class="panel panel-default"> 
    <div class="panel-heading"> 
     <h3 class="panel-title">Overview</h3> 
    </div> 
    <div class="panel-body"> 
     <div class="row"> 
      <div class="col-md-6"> 
       Version 
      </div> 
      <div class="col-md-6"> 
       @ViewBag.VersionName 
      </div> 
     </div> 
    </div> 
</div> 

當你在Chrome中運行這個，每次點擊鏈接的版本中的一個，在右側面板被更新。

當您在IE 11中運行此項時，面板不會更新。點擊版本鏈接後，您必須手動刷新頁面才能更新面板。

這說明了我的問題。

Answer 1

那麼，如果你看了你的鏈接。一個簡單的解決方案是定義一個什麼都不做的onbeforepageunload事件。不是一個理想的解決方案，但似乎它會驗證這是問題的原因，並且是一種解決方法，直到您找到其他東西。

或者，您也可以定義一個pageshow事件，並調用load來代替。