如何在phonegap / jquery移动iOS应用程序中加载函数

时间:2012-04-15 13:46:15

标签: jquery ios jquery-mobile cordova

在实现jquery mobile之前,我有以下代码正常工作。现在,我没有得到任何测试警报,所以它让我觉得它没有执行onbodyload函数。我如何让它工作?

<!DOCTYPE html>
<html>
  <head>
    <meta name="viewport" content="width=device-width, initial-scale=1.0, maximum-scale=1.0, user-scalable=no;" />

    <meta http-equiv="Content-type" content="text/html; charset=utf-8">
    <link rel="stylesheet" href="style.css" type="text/css" />      

    <!-- iPad/iPhone specific css below, add after your main css >
    <link rel="stylesheet" media="only screen and (max-device-width: 1024px)" href="ipad.css" type="text/css" />        
    <link rel="stylesheet" media="only screen and (max-device-width: 480px)" href="iphone.css" type="text/css" />       
    -->
    <!-- If your application is targeting iOS BEFORE 4.0 you MUST put json2.js from http://www.JSON.org/json2.js into your www directory and include it here -->
    <script type="text/javascript" charset="utf-8" src="cordova-1.5.0.js"></script>
    <script type="text/javascript" charset="utf-8" src="functions.js"></script>

    <script type="text/javascript" charset="utf-8" src="articles.js"></script>
    <link rel="stylesheet" type="text/css" href="jquery/jquery.mobile-1.1.0.min.css" />

         <script type="text/javascript" src="jquery/jquery-1.7.1.min.js"></script> 

         <!-- <script type="text/javascript" src="main.js"></script> -->

         <script type="text/javascript" src="jquery/jquery.mobile-1.1.0.js"></script>

    <script type="text/javascript" charset="utf-8">


    function onBodyLoad()
    {       
        document.addEventListener("deviceready",onDeviceReady,false);
        alert('body');
    }

    /* When this function is called, PhoneGap has been initialized and is ready to roll */
    /* If you are supporting your own protocol, the var invokeString will contain any arguments to the app launch.
    see http://iosdevelopertips.com/cocoa/launching-your-own-application-via-a-custom-url-scheme.html
    for more details -jm */
    function onDeviceReady()
    {
    alert('device');

        // do your thing!
        parms = getUrlVars();
        type = parms['type'];
        page = parms['page'];
        if(page=='') {
         page = 0;
        }
        filter_value = parms['filter_val'];


        vars = articles_get_info(type,page,filter_value);

        document.getElementById('pagetitle').innerHTML = vars['title'];
        document.getElementById('pagecontent').innerHTML = vars['page'];

    }

    </script>
  </head>
  <body onload="alert('hello');onBodyLoad()">
  <div data-role="page">
  <div data-role="header" id="header"><a href="index.html" style="float:right;" class="btn">Back</a>
      <h1 id="pagetitle"></h1>
      </div>
      <div data-role="content" id="pagecontent">

      </div>
      </div>
  </body>
</html>

我已经尝试用以下内容替换onbodyload()并删除onload =“”,但它仍然无效:

window.addEventListener('load', function () {
    document.addEventListener('deviceready', onDeviceReady, false);
}, false);

2 个答案:

答案 0 :(得分:0)

在加载文档时使用jQuery简写表示法:

$(function(){
    //The document is loaded. Put your code here
});

答案 1 :(得分:0)

根据PhoneGap documentatio n,你可以这样做:

$( function() {
     document.addEventListener("deviceready", onDeviceReady, false);
});

function onDeviceReady(){...}