0

JqueryMobileページで、HTMLページのスクリプトの配列として、グローバル変数を宣言しました

 <script src="map.js"></script>

 <script>
 var longitude= new Array();
 var latitude= new Array();
 var time=new Array();
 var date=new Array();
 </script> 
 </head>
 <body>
 <div data-role="page" id="home">
    <div data-theme="a" data-role="header" id="page-map">
        <h3>
           Route Map
        </h3>
    </div>        

    <div data-role="content" id="map-content">
            <div id="map_canvas"></div>
    </div><!-- /content -->
  </div>
  </body>

および外部の map.js ファイルに含まれるもの

 $(document).delegate("#home", "pagebeforecreate", function(){  
  console.log("pagebeforecreate :");
var jqxhr = $.getJSON("file:///android_asset/www/da.json", function(data) {

      $.each(data, function(i,ele)
        {
            longitude.push(ele.longitude);
        latitude.push(ele.latitude);
        time.push(ele.time);
        date.push(ele.date); 

        }); 
    }).done(function() { console.log( "second success" ); })
    .fail(function() { console.log( "error" ); alert("parsing error");})
    .always(function() { console.log( "complete" ); });

jqxhr.complete(function(){ console.log("second complete"); 
 console.log("longitude"+longitude);
});

  });
  $(document).delegate("#home", "pageinit", function(){  
console.log("pageinit :"+longitude.length+" and "+latitude.length);
    var center= new google.maps.LatLng(latitude[0],longitude[0]);
   var myOptions = {
            zoom: 15,
            center: center,
            mapTypeControl: false,
            mapTypeId: google.maps.MapTypeId.ROADMAP
   }     
  var map = new google.maps.Map(document.getElementById("map_canvas"), myOptions);
         var polylineCoordinates=new Aaary();
           for(var i=0;i<longitude.length;i++)
            {
             polylineCoordinates.push(new google.maps.LatLng(latitude[i],longitude[i]));
            }

  var polyline = new google.maps.Polyline({
      path: polylineCoordinates,
      strokeColor: '#FF0000',
      strokeOpacity: 1.0,
      strokeWeight: 2,
      editable: true
  });

  polyline.setMap(map); 

  }); 
  $(document).delegate("#home", "pagebeforeshow", function(){  
//longitude
console.log("pagebeforeshow :"+lon.length+" and "+lat.length);
   });

このコードを実行すると、ライフサイクル パターン pagebeforecreate -> pageinit -> pagebeforeshow ->pageshow を実行する必要があります。私にとっては同じですが、何が起こったのかというと、Pagebeforecreate にあるコード (ajax) が完了していないため、その実行が次に進み、pageinit ブロックにアクセスしているため、json ファイルから解析しているデータがグローバル変数の緯度と経度にプッシュされます。 pageinit では null と見なされます。それで、正しい方法は何ですか？

see my logcat file

     I/Web Console(4201): pagebeforecreate : at file:///android_asset/www/parse.js:2
     I/Web Console(4201): pageinit :0 and 0 at file:///android_asset/www/parse.js:23
     I/Web Console(4201): pagebeforeshow :0 and 0 at file:///android_asset/www/parse.js:27
     I/Web Console(4201): pageshow: 0 and 0 at file:///android_asset/www/parse.js:73
     I/Web Console(4201): second success at file:///android_asset/www/parse.js:13
     I/Web Console(4201): complete at file:///android_asset/www/parse.js:15
     I/Web Console(4201): second complete at file:///android_asset/www/parse.js:17
     I/Web Console(4201): longitude77.652633,77.651281,77.6492,77.647741,77.647312,77.647011,77.646861,77.646689,77.645016,77.643578,77.642097,77.640831,77.640917 at file:///android_asset/www/parse.js:18
4

1 に答える 1

0

グローバル変数を map.js の最初に移動します。

また、ロジック全体を pagebeforecreate から pagebeforeshow または pageshow に移動します。

また、ページの init は 1 回だけ実行されることに注意してください。そのため、ページで毎回値が必要な場合は、pagebeforeshow または pageshow にロジックを配置してください。

于 2013-07-16T08:24:29.123 に答える