2015-12-16 65 views
0

我有一個簡單的網頁,可以在Safari模擬器和OSX Safari中正常工作,但它會在完成表單時重新加載網站。我正在運行最新版本的iOS(9.2 13C75)。該頁面使用html5/css3編寫,並使用Javascript和引導CSS。 jQuery用於將頁面動態加載到指定的div中。基本的Web邏輯是:Safari iOS表單錯誤(?)

  1. 負荷主要HTML頁面
  2. onload事件,jQuery的獲取內容頁
  3. 選擇操作從導航欄
  4. jQuery的獲取加載形式
  5. 按完成(iosTest)清除頁面,顯示文字...或
  6. 按取消,清除頁面,jQuery的獲取取消消息

第5步工作,然後Safari重新加載原始URL
步驟6從未出現工作,Safari只是重新加載原始URL
我對所有問題的問題是「這是一個已知的錯誤,並有變通辦法......或者我在做些什麼通過動態加載表單真的很愚蠢?「


主HTML

<!DOCTYPE html> 
<html lang="en"> 
    <head> 
    <meta charset="utf-8"> 
    <meta name="viewport" content="width=device-width, initial-scale=1"> 
    <title>ios Mobile Safari Test</title> 
    <link href="dist/css/bootstrap.min.css" rel="stylesheet"> 
    <link href="css/ios_test.css" rel="stylesheet"> 
    </head> 
    <body onload="initialSetup('html/ios_about.html','body_cell')"> 
    <div class="navbar navbar-default navbar-fixed-top" role="navigation" id="topNav"> 
     <div class="container" id="navbar"> 
     <div class="navbar-header"> 
      <button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-collapse"> 
      <span class="sr-only">Toggle navigation</span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      <span class="icon-bar"></span> 
      </button> 
      <a class="navbar-brand" id="welcome" onClick="goHome('html/ios_about.html','body_cell')">ios Mobile Safari Test</a> 
     </div> 
     <div class="navbar-collapse collapse"> 
      <ul class="nav navbar-nav"> 
      <li id="iostest"><a onClick="goiosTest('html/ios_dialog.html', 'body_cell')">iosTest</a></li> 
     </ul> 
     </div><!--/.nav-collapse --> 
     </div> 
    </div> 
    <div class="noBorder" id="SD_Main"> 
     <div class="container" id="leftNav"></div> 
     <div class="container" id="body_cell"></div> <!-- /container --> 
    </div> 
    <div class="container" id="test" width="100%"></div> 
    <div class="container" id="debug" width="100%"></div> 
    <script src="js/jQuery/jquery-1.11.3.js"></script> 
    <script src="dist/js/bootstrap.min.js"></script> 
    <script src="js/iosTest.js"></script> 
    </body> 
</html> 


的JavaScript(iosTest.js)

var body_cell = "#body_cell"; 
function goHome(pageToLoad, target) 
{initialSetup(pageToLoad, target);} 
function initialSetup (pageToLoad, target) 
    { 
    $.when($.get(pageToLoad)).done(function (xml_stream) 
     { $("#"+target).empty();$("#"+target).append(xml_stream);}); 
    } 
function goiosTest(pageToLoad, target) 
{ 
    $.when($.get(pageToLoad)).done(function (xml_stream) 
    { $("#"+target).empty();$("#"+target).append(xml_stream);}); 
} 
function ios_postDialog(comment, o_name, c_name, Create) 
{ 
    $(body_cell).empty(); 
    $(body_cell).append("<h2>dialog completed</h2>"); 
} 
function ios_cancelDialog() 
{ 
    $.when($.get("html/ios_alt.html")).done(function (xml_stream) 
    { $(body_cell).empty();$(body_cell).append(xml_stream);}); 
} 


<div class = "container" id="SD_dialogBox"> 
<h2>SSample Dialog Box.</h2> 
    <form class="form-horizontal" role="form"> 
    <div class="form-group"> 
     <label for="c_name" class="col-sm-2 control-label" >Client Name:</label> 
     <div class="col-sm-8"> 
      <select id="c_name"></select> 
     </div> 
    </div> 
    <div class="form-group"> 
     <label for="o_name" class="col-sm-2 control-label" >Opportunity Name:</label> 
     <div class="col-sm-8"> 
      <select id="o_name" ></select> 
     </div> 
     </div> 
     <div class="form-group"> 
     <label for="comment" class="col-sm-2 control-label">Comments on Opportunity - anything that is relevant to you.</label> 
     <div class="col-sm-8"> 
      <textarea class="form-control" id="comment" rows="5"></textarea> 
     </div> 
     </div> 

     <div class="form-group"> 
     <div class="col-sm-offset-2 col-sm-8"> 
     <button class="button-wide" id="submit" onClick="ios_postDialog('comment', 'o_name', 'c_name', 'Create')">Save this Information</button> 
     <button class="button-wide" id="cancel" onClick="ios_cancelDialog()">Cancel</button> 
     </div> 
     </div> 
    </form> 
</div> 
+0

你在其他瀏覽器中測試過嗎? –

+0

有問題。我已在FFX,Safari,OSX和Windows上的Chrome以及xCode中的Safari iOS模擬器中進行了測試。適用於所有這些環境。對Web服務器的VPN訪問限制了對Safari的iOS訪問。所以,不,沒有在iOS上的其他瀏覽器上進行過測試。 –

回答

0

感謝您的反饋意見。原來是支持代碼的錯誤。埋在深處,一個JS功能被稱爲不存在。 iOS safari不喜歡它,並在發生錯誤時重新加載站點。