pageinit和jquery ajax调用

时间:2012-03-20 09:16:04

标签: jquery jquery-mobile

在我的页面test.html中我使用了从exem.js调用函数的pageinit,显示了函数开头的警告,我认为函数调用很好,但是ajax调用不起作用!!另外,如果我在没有pageinit和exem.js的test.html中测试ajax调用,代码工作正常,我的意思是这两个函数是正确的。这是我的代码: 的test.html:

<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<meta name="viewport" content="width=device-width, initial-scale=1">
<title>jQuery Mobile: Demos and Documentation</title>
<link rel="stylesheet"  href="jquery.mobile-1.0.1.min.css" />
<link rel="stylesheet" href="jqm-docs.css" />
<script src="jquery.js"></script>
<script src="jquery.mobile.themeswitcher.js"></script>
<script src="jqm-docs.js"></script>
<script src="jquery.mobile-1.0.1.min.js"></script>
<script src="exem.js"></script>
<script>
    $('#myPage').live('pageinit', function(event) {
        alert("pageinit working");
        jQuery.noConflict();
        getCategories ();
        getnameCategories ();
        });
</script>   
</head>

<body> 
<div id="myPage" data-role="page"> 
    <!-- L'entete du page -->  
      <div data-role="header"> 
        <h1>Identifiez-vous</h1>
            <a href="#search" data-role="button" data-theme="e">Config</a> 
            <a href="acceul.html" data-role="button" data-theme="e">Accueil</a>
      </div> 

    <!-- Le contenu du page --> 

    <div data-role="content" id="li">
        <ul data-role="listview" data-inset="true" data-theme="e">
            <li id="a1" ><img src='img1' alt="Categ"  class="ui-li-icon"/><a id="im1" href="AuthentificationCreation.html"></a></li>
            <li id="a2"><img src='img2'  alt="Categ"  class="ui-li-icon"/><a id="im2" href="AuthentificationCreation.html"></a></li>
            <li id="a3"><img src='img3'  alt="Categ"  class="ui-li-icon"/><a id="im3" href="AuthentificationCreation.html"></a></li>
            <li id="a4"><img src='img4'  alt="Categ"  class="ui-li-icon"/><a id="im4" href="AuthentificationCreation.html"></a></li>
            <li id="a5"><img src='img5'  alt="Categ"  class="ui-li-icon"/><a id="im5" href="AuthentificationCreation.html"></a></li>
            <li id="a6"><img src='img6'  alt="Categ"  class="ui-li-icon"/><a id="im6" href="AuthentificationCreation.html"></a></li>

        </ul>

    </div>

    <!-- Le pied du page --> 

        <div class="ui-bar-a">
            <div data-role="footer" data-position="fixed" data-theme="a">    
                <div data-role="navbar" >
                    <ul>
                        <li><a href="#search" data-icon="delete">Cat&eacute;gories</a></li>
                        <li><a href="#" data-icon="delete">Compte</a></li>
                        <li><a href="#" data-icon="delete">Panier</a></li>
                    </ul>
                </div><!-- /navbar -->
            </div><!-- /footer -->
        </div>

</div> 

</body>
</html>

exem.js:

var idCategories = new Array();
var nameCategories = new Array();
var ws_key="my_key";
var PHP_AUTH_USER="";


  function getCategories ()
  { alert("fn1");
    jQuery.ajax({
    type: "GET",
    async: false,
    url: "http://my_site/api/categories?ws_key="+ws_key+"&PHP_AUTH_USER="+PHP_AUTH_USER,
    dataType: "xml",
    success: parseXml
  });

function parseXml(xml) {var i=0;
  jQuery(xml).find("category").each(function()  {
    idCategories[i]= jQuery(this).attr('id');
    alert("studentName="+idCategories[i]);
    i=i+1;
  });
}

}

function getnameCategories ()
  {alert("fn2");
    for(i=1;i<idCategories.length;i++)
    {
        jQuery.ajax({
        type: "GET",
        async: false,
        url: "http://my_site/api/categories/"+idCategories[i]+"?ws_key="+ws_key+"&PHP_AUTH_USER="+PHP_AUTH_USER,
        dataType: "xml",
        success: parseXml
    });

function parseXml(xml) {alert("success");

  jQuery(xml).find("name").each(function()  {
    nameCategories[i]= jQuery(this).find('language')[0].firstChild.data;
    alert("aaa="+i+"aa"+nameCategories[i]);
  });
}
 jQuery('#im'+i).html(nameCategories[i]);
}
}

1 个答案:

答案 0 :(得分:0)

尝试通过pageshow更改pageinit