Question

我有一个名为ChooseType的页面将参数传递给另一个页面，chooseCity with mobile.changePage。加载chooseCity页面后，在刷新页面之前，pageinit事件似乎不会触发。我试过了pageshow和beforepagecreate。我还在标题中禁用了ajax。我搜索过的所有内容都没有提出解决方案。我应该提一下，我的参数正确传递，如地址栏所示。这是我在chooseType中的代码：

   <div id="type" data-role="page">
<div class="backgroundLeft">
<div data-role="header" class="heading">
<div class="backButton"><a href="index.html" data-ajax="false"><img src="images/backArrow.png" /></a></div>
    <h1>Best Car Repair Shops</h1>
    </div>

<div data-role="content">
  <div class="choiceList">
<h1>Please choose a shop Type</h1>
</div>
<ul data-role="listview" id="shopTypes" class="mainmenu">
<li><a href="#" class="typemenu" id="D">Diesel Repair</a></li>
<li><a href="#" class="typemenu" id="M">Mechanical</a></li>
<li><a href="#" class="typemenu" id="P">Paint and Body Shops</a></li>
<li><a href="#" class="typemenu" id="R">Tires</a></li>
<li><a href="#" class="typemenu" id="T">Transmission</a></li>
</ul>

</div>
<script type="text/javascript">
  $(document).on("pageshow", function(){
  $("#shopTypes li").on("click", "a", function(){
  var type = $(this).attr('id');
  $.mobile.changePage("chooseCity.html",{transition: "slide", data:{type:type}});
});
  });

</script>

</div>

</div>

而且，我的代码来自chooseCity.html。我在所有页面上都包含了部分内容：

     <script src="jquery-mobile/jquery-1.11.1.min.js" type="text/javascript"></script>
$(document).bind("mobileinit", function(){
  $.mobile.defaultPageTransition = "slide";
  $.mobile.ajaxEnabled = false;
});
</script>
<script src="jquery-mobile/jquery.mobile-1.4.3.min.js" type="text/javascript"></script>
<script src="jquery-mobile/purl.js"></script>

</head>
<body>

<div id="city" data-role="page">
<script src="jquery-mobile/purl.js"></script>
<script type="text/javascript">
$(document).delegate("#city", "pageshow", function(){
    var url = $.url(document.location); 
    var type = url.param("type");
jQuery(function() {
$.ajax({
url: 'includes/type' + type + '.php',
processData: true,
data:{},
dataType:'json',
success: function(json) {
        $.each(json.shops, function(i, dat){
            var count = dat.count,
                city = dat.City;
    $("#cityMenu").append(
    '<li><a href="#">' + city + '<span class="ui-li-count">' + count + '</span></a></li>');
   });
   $("ul").listview("refresh");
   },
   error: function(x,y,z) {

   }
   });
   });

   });

</script>

<div data-role="header" class="heading">
<div class="backButton"><a href="chooseType.html" data-ajax="false"><img src="images/backArrow.png" /></a></div>
<h1>Best Car Repair Shops</h1>
</div>

<div data-role="content">
<div class="choiceList">
<h1>Please choose a City</h1>
<ul data-role="listview" id="cityMenu" class="mainmenu">

</ul>

</div>
</div>

</div>

jQuery移动pageinit直到刷新后才开始

0 个答案: