Question

我最近设置了PhoneGap来开始学习应用程序开发，我听说jQuery Mobile是最好的方式，因为我希望使用它。我已经找到了jQuery的CDN，但它似乎与PhoneGap样式表和javascript冲突，我应该优先考虑其中一个吗？或者有没有办法这样做，所以两者都被使用？

我知道这听起来像个愚蠢的问题，但我还在学习。谢谢你的帮助。

Answer 1

我选择用jquery做的是从我的phonegap应用程序本地调用它而不是使用cdn ....在phonegap中要注意的一件大事是你在没有领先的情况下调用资源＆＃34; /＆＃34 ;

IE。

另外，我做的是这个：

<link rel="stylesheet" href="jquery/jquery.mobile-1.4.0.css" />
<script src="jquery/jquery-ui-1.10.4.custom.min.js"></script>
<script src="jquery/jquery.mobile-1.4.0.min.js"></script>
<script type="text/javascript">
    $.mobile.autoInitializePage = false;
    $.mobile.touchOverflowEnabled = true;
</script>

然后在你的onDeviceReady函数中，调用它：

$.mobile.initializePage();

特别是如果你的jquery页面处理程序正在调用特定的phonegap插件来处理诸如位置之类的东西，那么推迟页面初始化直到ondeviceready fires可能是好的。

简而言之： 1）我建议您从应用程序本地调用您的资源，因为它是一个移动应用程序 2）确保以cordova / phonegap所希望的方式调用您的资源 3）你可能会尝试推迟你的jquery移动初始化，直到你的ondeviceready已经解雇为止。

我刚刚在jquery mobile / cordova中构建了一个应用程序，我说它运行得很顺利。

Answer 2

具有PhoneGap页面的典型JQuery Mobile页面是下面的

<!DOCTYPE html>
  <html>
  <head>

  <title>My Page</title>
  <meta charset="utf-8" />
  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1">

  <link rel="stylesheet" href="css/mytheme.min.css"/>

  <link rel="stylesheet" href="css/jquery.mobile.icons.min.css" />
  <link rel="stylesheet" href="css/jquery.mobile.structure-1.4.0.css" /> 

  <script src="js/jquery.js"></script> 
  <script src="js/jquery.mobile-1.4.0.js"></script> 

  </head>

  <body>


        <!--Page-->

  <div data-role="page" data-theme="a" id="searchpage">

<div data-role="header">
     <h4>First Page</h4>
</div><!-- /header -->

<div role="main" class="ui-content">

          Hello World!

</div><!-- /content -->
  </div><!-- /page -->

  <script type="text/javascript" src="js/cordova.js"></script>

  <script type="text/javascript">

    document.addEventListener("deviceready", onDeviceReady, true);

    function onDeviceReady() {}

 </script>


</body>
</html>

注意：

我在本例中使用了JQuery Mobile 1.4.0
我使用了自定义主题mytheme.min.css

您的页面应该像这样安排，你很高兴

如何在PhoneGap中正确使用jQuery Mobile

2 个答案: