Question

我有这个简单的应用程序，在浏览器中工作正常，但是当使用phonegap构建它时，它只显示一个简单的html页面，意味着jquery无法正常工作，

在我的页面中，我调用jquery mobile.min.css，jquery.min.js而不是这个脚本：

$(document).bind("pagebeforechange", function (event, data) {  
$.mobile.pageData = (data && data.options && data.options.pageData)
      ? data.options.pageData
      : null;
});
$(document).ready( function (event) {

  compSearch('');
  $("#searchbtn").click(function () {
    var sText = $("#searchtxt").val();        
    $("#search").dialog("close");
    compSearch(sText)
  });
 }); 
function compSearch(searchString) {
  var theUrl = serverName + "MobileService.asmx/getOrgPage";
  var orgId = qString("org");      

  $.ajax({
    type: "POST",
    url: theUrl,
    data: '{"OrgId":' + orgId +
    ',"SearchString":"' + searchString +
    '"}',
    contentType: "application/json;charset=utf-8",
    dataType: "json",
    success: function (msg) {
      var s = msg.d[0];

      $("#header").html(s).trigger("create");

      $("#footer").html(msg.d[3]).trigger("create");          
      $("#contentHeading").html(msg.d[1]);          
      $("#content").html(msg.d[2]).find("ul").listview();

      $("#newscontent").html(msg.d[4]);

    },
    error: function (msg) {
      alert('error ' + msg.d[0]);
    }
  });

 } 

 $(document).on('pagebeforeshow', '#indivnews', function (event, data) {

  if ($.mobile.pageData && $.mobile.pageData.np) {


    var orgId = qString("org");

    var itemId = $.mobile.pageData.np;
    var theUrl = serverName + "MobileService.asmx/getNewsPage";
    var clubName = "";
    $.ajax({
      type: "POST",
      url: theUrl,
      data: '{"orgId":' + orgId +
      ',"compId":' + 0 +
      ',"itemId":' + itemId +
      ',"clubName":"' + clubName +
      '"}',
      contentType: "application/json;charset=utf-8",
      dataType: "json",
      success: function (msg) {
        var s = msg.d[0];

        $("#indivcontent").html(msg.d[4]);

      },
      error: function (msg) {
        alert('error ' + msg.d[0]);
      }
    });
     }
   });

比jquery mobile.min.js

就像我说它在浏览器中运行正常，如果你有想法解决它，请谢谢。

Answer 1

可能是在PQ和JQM正确初始化之前加载html页面。我在我的项目中使用以下内容来确保正确加载框架：

 var deviceReadyDeferred = $.Deferred();
 var jqmReadyDeferred = $.Deferred();
 document.addEventListener("deviceReady", deviceReady, false);
function deviceReady() {
            deviceReadyDeferred.resolve();
        }

        $(document).one("pageinit", function () {
            jqmReadyDeferred.resolve();
        });
 $.when(deviceReadyDeferred, jqmReadyDeferred).then(frameworksLoaded);

        function frameworksLoaded() {
     $.support.cors = true;
     $.mobile.allowCrossDomainPages = true;
     jQm.allowCrossDomainPages = true;
     console.log('PG & JQM ready');
    }

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8" />
<meta name="viewport" content="width =device-width, initial-scale=1.0, user-scalable=no" />
<title>Test</title>
<link href="Example.css" rel="stylesheet" />
<link href="../www/Content/jquery.mobile-1.4.0.css" rel="stylesheet" />
<link href="../www/Content/jquery.mobile-1.4.0.min.css" rel="stylesheet" />
<script src="../www/Scripts/jquery-2.1.0.min.js"></script>
</head>
<body>
</body>
</html>

对Deferred和Jquery Promises的引用：

http://api.jquery.com/deferred.promise/

jquery没有在phonegap android工作

1 个答案: