列表視圖jQuery Mobile 1.3.x和ASP.NET MVC 4的渲染問題Razor

Question

jQuery Mobile 1.3.x列表視圖在Internet Explorer 9/10和IE 8手機上呈現不正確的問題。它在Chrome，Safari，iOS上的Safari和IE 9/10上的jQuery Mobile 1.2.1上正確渲染。我在Win7上運行VS 2012，C＃，MVC和Razor。

使用VS 2012重現生成一個帶有Razor的ASP.NET MVC 4移動項目，然後使用NuGet升級到jQuery Mobile 1.3.0或1.3.1。

此代碼在主頁上呈現與列表項和子彈的左邊框之間的額外空間：

<ul data-role="listview" data-inset="true"> 
    <li data-role="list-divider">Navigation</li> 
    <li>@Html.ActionLink("About", "About", "Home")</li> 
    <li>@Html.ActionLink("Contact", "Contact", "Home")</li> 
</ul> 

升級之前： https://dl.dropboxusercontent.com/u/47974701/Capture%20B4.PNG

升級到1.3.0 jQuery Mobile的後： https://dl.dropboxusercontent.com/u/47974701/Capture%20After.PNG

Answer 1

將腳本塊移到HEAD部分可修復此問題。由於其他原因（它出於性能/優化原因在頁面的底部）並不理想，但它解決了IE無法正確初始化的問題。

@Scripts.Render("~/bundles/jquery") 
    <script> 
     $(document).on("mobileinit", function() { 
      $.mobile.ajaxEnabled = false; 
     }); 
    </script> 
    @Scripts.Render("~/bundles/jquerymobile") 
</head>