0

我正在尝试使用 Javascript/jQuery/Google Maps API 编写一些代码。

但是，我的脚本中的执行顺序有点奇怪。

var flats=[];
function initialize() {
  var mapOptions = {
    zoom: 10,
    center: new google.maps.LatLng(50.062, 19.937),
    mapTypeId: google.maps.MapTypeId.ROADMAP
  }
  var map = new google.maps.Map(document.getElementById('map-canvas'),mapOptions);

  /* Puling flats data using my API */
  $.getJSON("http://ks3353689.kimsufi.com:5000/v1/closest_pointlng=19.937&lat=50.062",parseFlat);
  function parseFlats(data){
    /* I put flats data in format usable by Google maps API */
    $.each(data, function(i, item){
      flat = [];
      flat.push('flat_name');
      flat.push(parseFloat(item.latitude));
      flat.push(parseFloat(item.longitude));
      // z-index to display flats on map
      flat.push(i+1);
      flats.push(flat);
    });
    console.log("I'm inside the function");
  }
  console.log("activating markers");
  setMarkers(map, flats);
}

我认为 jQuery API 调用将在 setMarkers 函数之前执行，但是当我查看 firebug 时，顺序不同：

activating markers
I'm inside the function

我究竟做错了什么？如何确保在 setMarkers 函数之前执行 jQuery 部分？

4

3 回答 3

1

The precise order of execution is:

  1. Assign variable mapOptions
  2. Assign variable map
  3. Call $.getJSON, which sends an AJAX request and registers the function to be called when the reply is received.
  4. Log activating markers
  5. Call setMarkers().
  6. Return from the initialize() function to the browser's event loop.
  7. When the AJAX response is received, call parseFlats(), which logs I'm inside the function.

Remember, the first A in AJAX stands for asynchronous.

于 2013-08-25T17:48:16.317 回答
0

您的问题是 $.getJSON 的异步性质。如果只需要在 parseFlats 之后调用 setMarkers(map, flats)，请在 parseFlats 内部调用

$.getJSON("http://ks3353689.kimsufi.com:5000/v1/closest_pointlng=19.937&lat=50.062",parseFlat);
function parseFlats(data){
  /* I put flats data in format usable by Google maps API */
  $.each(data, function(i, item){
    flat = [];
    flat.push('flat_name');
    flat.push(parseFloat(item.latitude));
    flat.push(parseFloat(item.longitude));
    // z-index to display flats on map
    flat.push(i+1);
    flats.push(flat);
  });
  console.log("I'm inside the function");
  console.log("activating markers");
  setMarkers(map, flats);      
}

另一种可能性是使用 $.ajax 并将 asyn 属性设置为 false （但我不会推荐它，因为浏览器会阻塞，直到收到服务器应答）

$.ajax({
  dataType: "json",
  url: 'http://ks3353689.kimsufi.com:5000/v1/closest_pointlng=19.937&lat=50.062',
  success: parseFlat,
  async:false
});
于 2013-08-25T18:05:17.363 回答
0

setMarkers在 of 里面移动parseFlats，你会得到你想要的订单。

于 2013-08-25T17:53:34.390 回答