jquery.mobile：orientation導致寬度錯誤

我有一些基於jquery.mobile的頁面;當我旋轉設備（WP8/IE10 & iPad2）時，頁面會以不正確的寬度重新渲染。jquery.mobile：orientation導致寬度錯誤

在iPad2上，如果我通過單擊文本框激活鍵盤然後再次單擊它，也會發生同樣的情況。

我的頁面代碼（如渲染）：

<!DOCTYPE html> 
<html xmlns="http://www.w3.org/1999/xhtml"> 
<head> 
    <meta charset="utf-8" /> 
    <meta name="author" content="Martin Robins" /> 
    <title>Do stuff</title> 
    <link href="../Content/jquery.mobile.structure-1.3.1.css" rel="stylesheet" /> 
    <link href="../Content/jquery.mobile-1.3.1.css" rel="stylesheet" /> 
    <link href="../Content/jquery.mobile.theme-1.3.1.css" rel="stylesheet" /> 
</head> 
<body> 
    <form method="post" action="./" id="form"> 
    <script src="../Scripts/jquery-1.9.1.js" type="text/javascript"></script> 
    <script src="../Scripts/jquery.mobile-1.3.1.js" type="text/javascript"></script> 
    <script type="text/javascript"> 
     $(document).bind("mobileinit", function() { 
     $.mobile.ajaxEnabled = false; 
     $.mobile.linkBindingEnabled = false; 
     }); 
    </script> 

    <div data-role="page" id="logon" data-theme="c"> 
     <div data-role="header" data-position="fixed"> 
     <h1>Select location</h1> 
     </div> 
     <div data-role="content"> 

     <div data-role="fieldcontain"> 
      <fieldset data-role="controlgroup" data-type="horizontal"> 
      <legend>Title</legend> 
      <input name="ctl00$FormContentPlaceHolder$Prefix" type="text" id="FormContentPlaceHolder_Prefix" style="text-transform: capitalize;" /> 
      </fieldset> 
     </div> 
     <div data-role="fieldcontain"> 
      <fieldset data-role="controlgroup" data-type="horizontal"> 
      <legend>Forenames</legend> 
      <input name="ctl00$FormContentPlaceHolder$Forenames" type="text" vcard_name="vCard.FirstName" id="FormContentPlaceHolder_Forenames" style="text-transform: capitalize;" /> 
      </fieldset> 
     </div>     
     </div> 
    </div> 
    </form> 
</body> 
</html>

注：有些內容已經被排除在外。我正在使用ASP.NET，因此還有一些ASP.NET AJAX腳本也被加載。

有什麼建議嗎？

來源

2013-04-18 Martin Robins

可能是我認爲這是一個元標記問題，請問您可以添加以下元標記並檢查它是否有效。

<meta name="viewport" content="width=device-width">

來源

2013-04-19 02:37:23

抱歉，由於延遲迴復您的建議，我花了一段時間纔將手放在iPad上進行測試。但這並沒有解決問題。如果我點擊一個文本框，然後點擊背景（從而放下鍵盤），寬度將變爲75％左右。 –

是答案;雖然你提供了足夠的答案讓我找到剩下的東西，但我正在標記你是正確的。 –

jquery.mobile：orientation導致寬度錯誤

回答

相關問題