PhoneGap＆jQuery Mobile：腳本無法加載

我花了一天的時間來解決以下問題。我試圖讓PhoneGap和jQuery-mobile運行。該應用程序啓動，但如果我提交表單，他再次加載相同的站點，忽略form.js中的所有內容（請參閱下面的html代碼）。我有這樣的HTML代碼：PhoneGap＆jQuery Mobile：腳本無法加載

<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <meta name="format-detection" content="telephone=no" /> 
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> 
    <link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.2.0.min.css" /> 
    <script type="text/javascript" src="js/jQuery/jquery-1.9.1.min.js"></script> 
    <script type="text/javascript" src="js/jQuery/jquery-migrate-1.0.0.js"></script> 
    <script type="text/javascript" src="cordova-2.4.0.js"></script> 
    <script type="text/javascript" src="js/index.js"></script> 
    <script type="text/javascript" src="js/form.js"></script> 
    <script type="text/javascript" src="js/jQuery.mobile/jquery.mobile-1.2.0.min.js"></script> 
    <title>SecureBook</title> 
</head> 
<body onload="app.initialize();"> 
    <div data-role="page"> 
     <div data-role="header"> 
      <h1>Welcome</h1> 
     </div> 
     <div data-role="content"> 
      <form id="userdata"> 
       <input type="text" id="username" placeholder="Username" autofocus> 
       <input type="password" id="password" placeholder="Passoword"> 
       <input type="submit" value="Anmelden" data-icon="forward" data-theme="b"> 
      </form> 
     </div> 
     <script> 
      gotLoaded(); 
      console.log("in HTML"); 
     </script> 
    </div> 
</body>

這似乎是因爲他並沒有叫）gotLoaded功能（也console.logging什麼，他不會加載form.js。該form.js看起來像：

function gotLoaded(){ 
console.log("loaded form"); 
}; 
$('#userdata').submit(function(event){ 
    console.log("transmitted form"); 
    event.preventDefault(); 
    var user = $('#username').val(); 
    var password = $('#password').val(); 
    $.mobile.changePage("sites/contacts.html",{ 
     transition: "none" 
    }); 
});

他沒有然而加載所有其他腳本出來的JS文件夾，但不會從form.js.執行任何至少不是在我的Android手機上，在瀏覽器中，他向我展示了我登錄的內容。我希望你能幫助我。非常感謝， stiller_leser

P.S.只是看到他沒有記錄（「傳輸表單」）。

來源

2013-02-20 stiller_leser

如果它是不是對你的問題，壓縮您的代碼，並將其發送到馬的電子郵件，我會解決它。 – Gajotres 2013-02-20 19:29:44

感謝您的報價，適用於我，如下所示。不是一個好的解決方案，但它的工作。儘管對「爲什麼」的回答是受歡迎的。 – 2013-02-20 21:55:07

您可以嘗試在頭部的頁面顯示處理程序（http://jquerymobile.com/demos/1.0rc3/docs/api/events.html）中添加提交事件處理程序，但還需要爲頁面提供一個標識。

<script> 
    $('#pageID').live("pageshow", function() { 
     $('#userdata').submit(function(event){ 
      console.log("transmitted form"); 
      event.preventDefault(); 
      var user = $('#username').val(); 
      var password = $('#password').val(); 
      $.mobile.changePage("sites/contacts.html",{ 
       transition: "none" 
      }); 
     }); 
    }) 
</script>

來源

2013-02-20 20:36:38 ventom

嗨，我爲我工作如下所示： – 2013-02-20 21:55:53

適用於我，如下所示。不知道爲什麼。似乎最後添加我的表單腳本確保所有jQuery-Stuff已加載。這是最終的代碼。

<html> 
<head> 
    <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> 
    <meta name="format-detection" content="telephone=no" /> 
    <meta name="viewport" content="user-scalable=no, initial-scale=1, maximum-scale=1, minimum-scale=1, width=device-width, height=device-height, target-densitydpi=device-dpi" /> 
    <link rel="stylesheet" type="text/css" href="css/jquery.mobile-1.2.0.min.css" /> 

    <script type="text/javascript" src="cordova-2.4.0.js"></script> 
    <script type="text/javascript" src="js/index.js"></script> 
    <script type="text/javascript" src="js/jQuery/jquery-1.9.1.min.js"></script> 
    <script type="text/javascript" src="js/jQuery/jquery-migrate-1.0.0.js"></script> 
    <script type="text/javascript" src="js/jQuery.mobile/jquery.mobile-1.2.0.min.js"></script>  
    <title>SecureBook</title> 
</head> 
<body onload="app.initialize();"> 
    <div data-role="page"> 
     <div data-role="header"> 
      <h1>Welcome</h1> 
     </div> 
     <div data-role="content"> 
      <form id="userdata" onsubmit="gotLoaded();"> 
       <input type="text" id="username" placeholder="Username" autofocus> 
       <input type="password" id="password" placeholder="Passoword"> 
       <input type="submit" value="Anmelden" data-icon="forward" data-theme="b"> 
      </form> 
     </div> 
     <script> 
      //WORKS 
      console.log("in HTML"); 
      //JQUERY works here 
      console.log($('title').html()); 
     </script> 
    </div> 

<!-- Put customs scripts here as it seems, that jQuery loads to slow in the head and scripts already run --> 
<script type="text/javascript" src="js/form.js"></script> 
</body>

來源

2013-02-20 21:57:50

PhoneGap＆jQuery Mobile：腳本無法加載

回答

相關問題